상상 너머 그 무언가...

원그리기에 사용되는 curveTo의 controlPoint 구하는 방법 본문

개발관련(Development)/플래시(Flash)

원그리기에 사용되는 curveTo의 controlPoint 구하는 방법

Clack 2012. 8. 2. 19:54



위의 이미지에 있는 점B의 x.y값을 구하기 위해서는 

원의 반지름r, 두 anchoir point 좌표와 각 anchoir point의 각도값을 알고 있어야 한다.

두 앵커 포인트 각도값의 차이를 구하여 그리고자하는 호의 각을 구하고

위의 식에 호의 각을 대입하여 원점과 control point 두 점 사이의 선AB 의 길이를 구하여

반지름과 선AB의 길이 값을 가지고 삼각함수에 대입하면 점B의 좌표값을 구할 수 있다.


curveTo에 사용되는 controlPoint는 그리고자 하는 호의 시작 각도와 끝 각도 사이의 각을 구하여

위에 적혀 있는 식 처럼 

반지름 /  Math.cos(두 앵커포인트 사이의 각/2)

을 실행하여 나온 원의 중심부터 controlPoint와의 거리값을 구한 뒤

controlPoint의 각도를 구하여 해당 각도값과 반지름 값을 가지고 삼각함수를 이용하여 계산하면 최종적의 conrolPoint값을 구할 수 있다.


참조 : http://www.multimediacollege.be/2010/09/drawing-a-perfect-circle-with-the-curveto-function/