Sun-Jeong Kim

선 그리기

3rd Week, 2008

Computer Graphics2

Bresenham’s Algorithm (1)

DDA 알고리즘보다 정확하고 효율적임

정수형의 덧셈, 뺄셈 연산만 수행

정수형 파라미터의 부호로 판단

예) 직선의 기울기 < 1.0픽셀 (xk, yk)에 점을 찍은 후, 다음 열 xk+1=xk+1에서 어느 픽셀에 점을 찍어야 할까?

(xk+1, yk) 또는 (xk+1, yk+1)

xk

yk

xk+1

yk+1

Computer Graphics3

Bresenham’s Algorithm (2)

판단 파라미터 (decision parameter)(xk+1, yk) 또는 (xk+1, yk+1) 중 어느 곳에 점을 찍을지 결정해주는 파라미터

장점: 부호로 판단

xk

yk

xk+1

yk+1

d1

d2

xym

bmxy

∆∆=+=

( )( )

cyxxy

bxyyxxy

ddxp

kk

kk

k

+⋅∆−⋅∆=−∆+∆+⋅∆−⋅∆=

−∆=

22

1222221

pk > 0 (xk+1, yk+1)

pk < 0 (xk+1, yk)

pk > 0 (xk+1, yk+1)

pk < 0 (xk+1, yk)

Computer Graphics4

Bresenham’s Algorithm (3)

초기값: 최초의 판단 파라미터

증가분최초의 판단 파라미터에 증가분만 더하여 다음 단계의판단 파라미터 계산

장점: 정수형의 덧셈, 뺄셈 연산만 수행

결론

( ) ( )( ) ( )kkkk

kkkkkk

yyxxxy

cyxxycyxxypp

−∆−−∆=+⋅∆−⋅∆−+⋅∆−⋅∆=−

++

+++

11

111

22

2222

11 +=+ kk xx( )kkkk yyxypp −∆−∆+=∴ ++ 11 22

( )12222 000 −∆+∆+⋅∆−⋅∆= bxyyxxyp

xyp ∆−∆=∴ 20

pk > 0 (xk+1, yk+1) pk+1 = pk + 2∆y – 2∆x

pk < 0 (xk+1, yk) pk+1 = pk + 2∆y

pk > 0 (xk+1, yk+1) pk+1 = pk + 2∆y – 2∆x

pk < 0 (xk+1, yk) pk+1 = pk + 2∆y

Computer Graphics5

Pseudo Code of Bresenham’s Algorithm

#include <stdlib.h>#include <math.h>

/* Bresenham’s algorithm for |m|<1.0 */void lineBres( int x0, int y0, int xEnd, int yEnd ){

int dx = fabs(xEnd – x0), dy = fabs(yEnd – y0);int p = 2 * dy – dx;int twoDy = 2 * dy, twoDyMinusDx = 2 * (dy – dx);

/* Determine which endpoint to use as start position */if( x0 > xEnd ) {

x = xEnd; y = yEnd; xEnd = x0;}else {

x = x0; y = y0;}setPixel( x, y );

while( x < xEnd ) {x++;if( p < 0 )

p += twoDy;else {

y++;p += twoDyMinusDx;

}setPixel( x, y );

}}

#include <stdlib.h>#include <math.h>

/* Bresenham’s algorithm for |m|<1.0 */void lineBres( int x0, int y0, int xEnd, int yEnd ){

int dx = fabs(xEnd – x0), dy = fabs(yEnd – y0);int p = 2 * dy – dx;int twoDy = 2 * dy, twoDyMinusDx = 2 * (dy – dx);

/* Determine which endpoint to use as start position */if( x0 > xEnd ) {

x = xEnd; y = yEnd; xEnd = x0;}else {

x = x0; y = y0;}setPixel( x, y );

while( x < xEnd ) {x++;if( p < 0 )

p += twoDy;else {

y++;p += twoDyMinusDx;

}setPixel( x, y );

}}

Computer Graphics6

DrawLine( )

Computer Graphics7

What’s Wrong?

Computer Graphics8

All Cases (1)

Computer Graphics9

All Cases (2)

Computer Graphics10

In Case of –1<m<0 (1)

픽셀 (xk, yk)에 점을 찍은 후, 다음 열 xk+1=xk+1에서 어느 픽셀에 점을 찍어야 할까?

(xk+1, yk) 또는 (xk+1, yk–1)

0 < m < 1 인 경우와 서로 대칭

xk

yk

xk+1

yk–1

d1

d2

Computer Graphics11

In Case of –1<m<0 (2)

Computer Graphics12

출력 결과 – 기울기 –1<m<0

Computer Graphics13

In Case of m>1 (1)

픽셀 (xk, yk)에 점을 찍은 후, 다음 행 yk+1=yk+1에서 어느 픽셀에 점을 찍어야 할까?

(xk, yk+1) 또는 (xk+1, yk+1)

판단 파라미터( )

( ) ( )bymxxxd

xbymxxd

kkk

kkk

−+−+=−+=−−+=−=

1111

11

2

1

d1– d2 < 0 (xk , yk+1)

d1– d2 > 0 (xk+1, yk+1)

d1– d2 < 0 (xk , yk+1)

d1– d2 > 0 (xk+1, yk+1)

( )...22

21

+⋅∆−⋅∆=−∆=

kk

k

xyyx

ddyp

xk

yk

xk+1

yk+1d1 d2

( )yxm

bymx

bmxy

∆∆=−=+=

1

1

Computer Graphics14

In Case of m>1 (2)

초기값

증가분

Bresenham’s algorithm for m>1

...22 000 +⋅∆−⋅∆= xyyxp

( ) ( )( ) ( )kkkk

kkkkkk

xxyyyx

xyyxxyyxpp

−∆−−∆=+⋅∆−⋅∆−+⋅∆−⋅∆=−

++

+++

11

111

22

...22...22

11 +=+ kk yy

pk < 0 (xk , yk+1) pk+1 = pk + …

pk > 0 (xk+1, yk+1) pk+1 = pk + …

pk < 0 (xk , yk+1) pk+1 = pk + …

pk > 0 (xk+1, yk+1) pk+1 = pk + …

Computer Graphics15

Exercises (1)

기울기가 1보다 큰 직선을 그릴 수 있도록 함수를완성하시오.

(100, 100)

(200, 400)

Computer Graphics16

In Case of m<–1

픽셀 (xk, yk)에 점을 찍은 후, 다음 행 yk+1=yk+1에서 어느 픽셀에 점을 찍어야 할까?

(xk, yk+1) 또는 (xk–1, yk+1)

m > 1 인 경우와 서로 대칭

xk–1

yk

xk

yk+1d2 d1

Computer Graphics17

Exercises (2)

기울기가 –1보다 작은 직선을 그릴 수 있도록 함수를 완성하시오.

(100, 100)

(200, 400)

(200, 100)

(100, 400)

Computer Graphics18

Assignment #1 (1)

(필수 사항) – 총 50점

마우스로 클릭하여 점을 찍고, 마우스로 드래그하여 직선을 그릴 수 있도록 하시오. (10점)

사용자가 입력한 모든 점과 직선들을 화면에 출력하시오. (10점)

다양한 크기의 기울기(0 또는 ∞도 포함)를 갖는 직선을 그릴 수 있도록 함수를 완성하시오. (30점)

Computer Graphics19

Assignment #1 (2)

(옵션) – 총 50점점의 속성인 색상과 크기를 변경하시오. (10점)

직선의 속성인 색상과 너비를 변경하시오. (10점)

변경된 색상과 크기를 각 점마다 저장하여 다양한 점들이 함께 화면에 출력될 수 있도록 하시오. (10점)

변경된 색상과 너비를 각 직선마다 저장하여 다양한 직선들이 함께 화면에 출력될 수 있도록 하시오. (10점)

직선에 무늬를 넣으시오. (10점)

Computer Graphics20

Assignment #1 (3)

제출 기한 및 방법

4월 3일 (목) 11:00AM 까지

소스코드와 스냅샷 이미지를 E-mail로 제출소스코드: cpp, h, rc, bmp 파일 등

스냅 샷: 실행 결과 화면을 2~3장의 이미지로 캡쳐

위 파일들을 “학번.zip”으로 압축하여 보낼 것

조교(송성도): jack096@hallym.ac.kr

스스로 채점표는 출력하여 수업시간에 제출

Computer Graphics21

스스로 채점표 (1)

출력 후 스스로 채점하여 제출하시오. (O, Δ, X 로표기)

학번:

이름:

필수 사항 (50점)

마우스를 클릭하여 점 생성 (5점)

마우스를 드래그하여 직선 생성 (5점)

생성된 모든 점을 저장하여 화면에 출력 (5점)

생성된 모든 직선을 저장하고 화면에 출력 (5점)

기울기가 0보다 크고 1보다 작은 직선 출력 (5점)

기울기가 –1보다 크고 0보다 작은 직선 출력 (5점)

기울기가 1보다 큰 직선 출력 (5점)

기울기가 –1보다 작은 직선 출력 (5점)

기울기가 0인 직선 출력 (5점)

기울기가 ∞인 직선 출력 (5점)

Computer Graphics22

스스로 채점표 (2)

출력 후 스스로 채점하여 제출하시오. (O, Δ, X 로표기)

학번:

이름:

옵션 (50점 + α)

점의 속성 중 색상 변경 (5점)

점의 속성 중 크기 변경 (5점)

직선의 속성 중 색상 변경 (5점)

직선의 속성 중 너비 변경 (5점)

점 구조체를 변경하여 각 점마다 속성 저장 (10점)

직선 구조체를 변경하여 각 직선의 속성 저장 (10점)

직선의 속성 중 무늬 지정 (10점)

기타 (+α점) :