3장 Additional Drawing Tools(part 2) 창원대학교 정보통신공학과 박동규

Drawing Circles and Arcs • 원과 호 그리기 – 원 그리기는 n-각형 그리기에서 n을 큰 수로 둔 것과 유사하다 – ngon() 그리기에 정점 수를 50으로 둔 프로그램 void drawCircle(Point2 center, float radius) { const int numVerts = 50; // use larger for a better circle ngon(numVerts, center.getX(), center.getY(), radius, 0); } IVIS Lab, Changwon National University

Drawing Arcs • 호 그리기 – 중심 c와 반지름 R을 가진 부모 원으로 부터 시각각 a와 끝각 b를 따라 쓸어내리며 그린다 void drawArc(Point2 center, float radius, float startAngle, float sweep) { // 시작각과 스윕(sweep)은 60분법 표기 const int n = 30; // number of intermediate segments in arc float angle = startAngle * 3.14159265 / 180; // 초기각(radian으로 변환) float angleInc = sweep * 3.14159265 /(180 * n); // 증가각 float cx = center.getX(), cy = center.getY(); cvs.moveTo(cx + radius * cos(angle), cy + radius * sin(angle)); for(int k = 1; k < n; k++, angle += angleInc) cvs.lineTo(cx + radius * cos(angle), cy + radius * sin(angle)); } IVIS Lab, Changwon National University

호 그리기 • 원은 호의 특별한 경우 IVIS Lab, Changwon National University

Blending arcs together • Practice exercises – 동일한 접선(tangent line)을 공유하는 두개의 호 – 이음매 없는 자연스러운 곡선 IVIS Lab, Changwon National University 음양 기호(yin-yang symbol)

A famous logo • 벤츠 로고 그리기 – 두개의 원과 이등변 삼각형 을 이용하여 로고 그리기 IVIS Lab, Changwon National University

Drawing clocks and such IVIS Lab, Changwon National University

3.4.4 Successive Refinement of curves IVIS Lab, Changwon National University

Koch curve • 이전 단계에 비해 길이가 4/3 증가하는 곡선 • Perimeter: the i -th generation shape S i is three times the length of a simple Koch curve, 3(4/3) i , which grows forever as i increases. • Area inside the Koch snowflake: grows quite slowly, and in the limit, the area of S ∞ is only 8/5 the area of S 0 .

S0 S1 S2 IVIS Lab, Changwon National University

Fifth-generation Koch Snowflake

IVIS Lab, Changwon National University

3.5 The Parametric Form for a curve • 곡선 표현을 위한 두 가지 기본 방식 – 음함수 기법 (implicit method) – 매개변수 기법(parametric method) • 음함수 기법은 곡선은 다음 식을 만족하는 x,y를 가진 함 수 F(x,y)로 표현 – F(x,y)=0 • 직선의 음함수 표현 – F(x,y)=(y-A y )(B x -A x )-(x-A x )(B y -A y ) • 원의 음함수 표현 – F(x,y) = x 2 +y 2 -R 2 IVIS Lab, Changwon National University

3.5.1 parametric forms for curves • 직선의 표현 – x(t)=A x +(B x -A x )t – y(t)=A y +(B y -A y )t • 타원의 표현 – x(t) = Wcos(t) – y(t) = Hsin(t) for 0≤ t ≤ 2π IVIS Lab, Changwon National University

음함수 표현 • 원의 표현 – 원 F(x,y) = 0 – 원의 내부 F(x,y) < 0 – 원의 외부 F(x,y) > 0 • y=g(x) 표현 –

y

 

R

2 

x

2 – 두개의 함수꼴로 표현 IVIS Lab, Changwon National University

ellipse described parametrically IVIS Lab, Changwon National University

매개변수 표현법으로부터 음함수 표현법을 얻기 • 위의 타원 매개변수 표현법을 음함수 표현법으로 바꾸고자 – sin(t) 2 +cos(t) 2 =1 을 이용 – (x/W) 2 +(y/H) 2 =1 을 얻을 수 있다 IVIS Lab, Changwon National University

매개변수 표현법을 이용한 곡선 그리기 • 매개변수 표현법 – P(t) = (x(t), y(t))에서 t는 0에서 T까지 변화 – 근사화를 위한 sample point를 추출 IVIS Lab, Changwon National University

프로그램 코드 // draw the curve (x(t), y(t)) using // the array t[0],..,t[n-1] of sample-times?

glBegin(GL_LINES); for(int i = 0; i < n; i++) glVertex2f((x(t[i]), y(t[i])); glEnd(); • 샘플 포인터는 부드러운 곡선을 얻기 위하여 충분히 촘촘 하게 하여야 함 IVIS Lab, Changwon National University

parametric form #define TWOPI 2*3.14159265

glBegin(GL_LINES); for(double t = 0; t < TWOPI; t += TWOPI/n) glVertex2f(W*cos(t), H*sin(t)); glEnd(); • 매개변수 표현법은 음함수 표현법과 양함수 표현법의 어 려움을 피할 수 있다 • 곡선은 다변수 함수이며 서로 교차하는 상황이 발생 가능 하다 IVIS Lab, Changwon National University

3.5.3 극좌표 형태 • 극좌표 – 임의의 점의 위치가 정점으로부터의 거리와 방향에 의해서 정해지 는 것을 기초로하여 생각한 좌표계 IVIS Lab, Changwon National University

삼차원 곡선 • P(t) = (x(t), y(t), z(t)) 형 식 • 나선(helix)형 – x(t) = cos(t) – y(t) = sin(t) – z(t) = bt • 나선(helix)형의 변형 – x(t) = Wcos(t) – y(t) = Hsin(t) – z(t) = bt IVIS Lab, Changwon National University

3.9 요약 • 세계 좌표계와 뷰포트 – zoom, roam을 쉽게 한다 • clipping 알고리즘 • Canvas 클래스를 이용한 drawing – setWindow(), setViewport(), moveTo(), lineTo() IVIS Lab, Changwon National University

끝