그래프 영역 표현

[ohdair]

그래프를 돋보이게 하기 위한 영역 색으로 표현

[ohdair]

Area 영역 칠하는데, 미적으로 보기 안좋은 이슈

1. 그래프보다 영역을 표현하는 폭이 더 짧음
2. 그래프를 그리는 부분과 영역을 칠하는 부분의 경계가 보임

aroundSpacing	equalSpacing

해결하기 위한 방안

1. 그래프의 선 굵기에 따라 영역의 폭도 넓어지도록 변경
2. 영역이 그래프보다 먼저 칠해지도록 변경
   • context에서 꼬이는 문제가 발생
   • 추후 업데이트 하면서 색 변경 및 그라데이션(2가지 이상의 색 표현) 기능되도록
3. 그래프와 영역의 색을 통일하도록 변경

[ohdair]

현재 프로젝트에서 draw에서 그려야 하는 것이 3개가 존재

• 그래프 선
• 그래프의 영역(그래프 선에서 하단부까지의 영역)
• 그래프의 점

문제점

1. 선과 점을 그리고 영역을 채우게 되면서 점이 가려지는 현상
2. UIGraphicsGetCurrentContext을 사용하고 나서 UIBezierPath을 사용하는 경우 에러 발생
   • setFill()을 사용하는 곳에서 에러로 인해 앱 강제 종료
   • 색을 미리 지정해두고 UIBezierPath.fill()하는 경우 좌표가 상/하 반전 및 축소되는 현상

해결하기 위한 시도

UIGraphicsGetCurrentContext을 사용해서 그라데이션을 넣는 것과 UIBezierPath는 서로 다른 Context로 혼용해서 사용하려고 시도한 방법에 대해 설명하고자 한다.

1. UIBezierPath 사용하고 나서 UIGraphicsGetCurrentContext 사용

   • 점이 가려지는 문제 발생
     

2. UIGraphicsGetCurrentContext을 사용 후, 점을 그리도록 변경

   • 그래도 점이 가려지는 문제 발생
     

3. UIGraphicsGetCurrentContext에서 restoreGState() 선언 후, 점을 그리도록 변경

   • 점이 이상하게 그려지는 문제 발생
     

4. UIGraphicsPopContext() 선언 후, 점을 그리도록 변경

   • 점이 그려지지 않은 문제 발생
     

5. UIGraphicsGetCurrentContext 내부에서 점이 그려지도록 변경

   • 2번과 동일

[ohdair]

Context를 두 번 사용 및 그래프 그리는 순서를 변경