Chuong 12_NoRestriction

8/3/2019 Chuong 12_NoRestriction

http://slidepdf.com/reader/full/chuong-12norestriction 1/49

Môn Đồ họa máy tính

Thờ i lượ ng: 60 tiết (lý thuyết + thực hành trên máy)

Tài liệu tham khảo:[1] Nhậ p môn đồ họa, Lươ ng Chi Mai, Huỳnh Thị Thanh Bình, 2000[2] K ỹ thuật đồ họa máy tính, Lê Tấn Hùng, Huỳnh Quyết Thắng, 2004[3] Cơ sở đồ họa máy tính, Hoàng Kiếm, 1999[4] Đồ họa vi tính, Huỳnh Văn Đức, Nguyễn Quốc Cườ ng, Hoàng Đức Hải

[5] Computer Graphic, J.D. Foley, A.V. Dam

Đánh giá:- Câu hỏi trên lớ p- Bài kiểm tra điều kiện- Thi: vấn đáp / viết

1



Phần mở đầu: Giớ i thiệu về đồ họa máy tính

Thuật ngữ “Đồ họa máy tính – Computer Graphics” đượ c đề xuất bở i một nhà khoa học Mỹ tên là Wiliam Fetter vào năm 1960 khi ông đang nghiên cứu xây dựng mô hình buồng láimáy bay cho hãng Boing. Đồ họa máy tính có thể đượ c hiểu như là tất cả những gì liên quanđến việc tạo ra ảnh (image) bằng máy tính. Chúng bao gồm: tạo, lưu tr ữ, thao tác trên cácmô hình và các ảnh. W. Fetter đã dựa trên các hình ảnh ba chiều của mô hình ngườ i phicông trong buồng lái để xây dựng nên mô hình tối ưu cho buồng lái máy bay Boing.

1. Tổng quan về một hệ đồ họaCác thành phần phần cứng:

• Thiết bị hiển thị: màn hình, máy in• Thiết bị nhậ p: bàn phím, chuột

Cấu tạo của màn hình dạng điểm (raster – scan display): chùm tia điện tử đượ c quét ngangqua màn hình mỗi lần 1 dòng và quét tuần tự từ trên xuống dướ i. Việc bật tắt các điểm sángtrên màn hình phụ thuộc vào cườ ng độ của tia điện tử và đây là cơ sở cho việc tạo ra hìnhảnh trên màn hình,

Mỗi điểm sáng trên màn hình đượ c gọi là pixel. Các thông tin về hình ảnh trên màn hìnhđượ c lưu tr ữ trong vùng nhớ đệm gọi là bộ nhớ màn hình (refresh buffer). Để thay đổi hìnhảnh trên màn hình, cần làm thay đổi thông tin trong vùng nhớ đệm. Vùng này có thể nằmtrên Video card hay trích ra từ bộ nhớ chính.

Để tạo ra ảnh Đen - Tr ắng, chỉ cần lưu thông tin của mỗi pixel bẳng 1 bit( 1/0 = bật/tắt điểmảnh). Trong tr ườ ng hợ p ảnh nhiều màu, ngườ i ta cần nhiều bit hơ n. Nếu ta dùng b bit thì cóthể lưu tr ữ đượ c 2 b giá tr ị màu khác nhau.

Các công cụ phần mềm:• Công cụ ứng dụng (application package):đượ c thiết k ế cho ngườ i sử dụng để tạo ra

ảnh trong những l ĩ nh vực chuyên nghiệ p nào đó mà không cần quan tâm tớ i các thaotác bên trong hoạt động ra sao. Ví dụ: AutoCAD, Adobe Photoshop, ...

• Công cụ lậ p trình: (programming package): cung cấ p một thư viện các hàm đồ họa để

dùng trong các ngôn ngữ lậ p trình cấ p cao. Ví dụ: GRAPH.TPU (Pascal), Open GL

2. Các ứng dụng của đồ họa máy tính (computer graphics) Công cụ hỗ trợ thiết k ế (CAD/CAM)Hỗ tr ợ thiết k ế đượ c xem là một ứng dụng chính của đồ họa máy tính, trong đó đối tượ ngđượ c xây dựng tr ực tiế p là mô hình thiết k ế. Hiện nay đồ họa máy tính đượ c ứng dụng trongviệc thiết k ế • các chi tiết cơ khí• hệ thống điện• thiết bị điện tử • thiết k ế thân ô tô• hệ thống cáp quang

2



• mạng truyền thông• và r ất nhiều thứ khác ...

Các chi tiết sẽ đượ c vẽ trên màn hình nhờ các công cụ đồ họa ban đầu dướ i dạng phác thảo,sau đó đượ c chỉnh sửa bằng kinh nghiệm của ngườ i k ỹ sư cũng như khả năng tr ợ giúp thôngminh của phần mềm thiết k ế.Khác vớ i các bản vẽ trên giấy, ngườ i thiết k ế có thể xem môhình thiết k ế trên máy tính từ mọi góc độ, dễ dàng thay đổi mọi chi tiết và quan sát hiệu ứngcủa sự hiệu chỉnh đó.

Giao diện Ngườ i - Máy Ngày nay hầu hết các chươ ng trình ứng dụng trên PC đều có giao diện vớ i ngườ i dùng dựatrên hệ thống tươ ng tác đồ họa: Cửa sổ, Biểu tượ ng, Con tr ỏ chuột, Menu .... Giao diện đồ họa thực sự mang lại sự thoải mái cho ngườ i sử dụng

Biểu diễn thông tin

Các trình ứng dụng sử dụng công cụ đồ họa để tạo ra các biểu đồ, đồ thị ... minh họa tươ ngquan giữa các đối tượ ng trong kinh doanh, khoa học, các dữ liệu tài chính, thống kê ... Cácmáy tính, máy ATM, máy bán hàng, máy bán vé tàu ... ở nơ i công cộng đều sử dụng giaodiện đồ họa để biểu diễn những mục thông tin hướ ng dẫn khách hàng

Giải trí, nghệ thuậtĐối vớ i các nhà tạo mẫu, ngườ i chụ p ảnh, những chươ ng trình tr ợ giúp thiết k ế mẫu haychỉnh sửa ảnh như PhotoShop, 3DMax, ... đã giúp họ thiết k ế các hình ảnh sống động. Đồ họa máy tính cung cấ p phươ ng tiện cho các nhà làm phim tạo ra những bộ phim nổi tiếngnhư Công viên Khủng long, Xác ướ p Ai cậ p ... nhờ những k ỹ xảo điện ảnh thực hiện trên

máy tínhGiáo dục và đào tạoĐồ họa máy tính cũng góp phần quan tr ọng trong nghiên cứu các thực thể tr ừu tượ ng, mô

phỏng cấu trúc vật thể, tiến trình của các phản ứng hóa học, hạt nhân, hoạt động của các hệ thống sinh lý. Trong đào tạo, các ứng dụng mô phỏng đượ c dùng để kiểm tra trình độ ngườ ilái, huấn luyện phi công, điều khiển giao thông ...

Bản đồ học, nghiên cứ u địa lý

Đồ họa máy tính đượ c sử dụng để tạo ra các sơ đồ địa lý và các đối tượ ng tự nhiên một cách

chính xác từ những số liệu đo đượ c. Ví dụ như bản đồ địa lý, bản đồ thờ i tiết, bản đồ mật độ dân số, sơ đồ khoan thăm dò, biểu đồ hải dươ ng học.

3



Chươ ng I: Công cụ đồ họa của Turbo Pascal (TP)

1. Giớ i thiệu

- Thiết bị phần cứng điều khiển việc hiển thị hình ảnh lên màn hình có tên là Video Card(chúng ta hay gọi là “card màn hình”).

- Có nhiều loại Card màn hình vớ i khả năng mạnh yếu khác nhau, mỗi loại cần driver (trìnhđiều khiển) riêng. Bảng sau là các file driver của TP.

File driver Kiể u Video card

CGA IBM CGA , chỉ hiển thị đượ c 4 màuHERC.BGI HERCULES MONOCHROME, 2 màu

EGAVGA.BGI VGA và đại đa số các card màn hìnhhiện nay.Có 16 màu. Độ phân giải 640 * 480

Chúng ta sẽ chỉ dùng loạimạnh nhấ t

này

2. Phải làm gì để khở i tạo chế độ đồ họa ?

Chúng ta sẽ lậ p trình đồ họa bằng TP. Muốn vậy cần phải:

- Có các file: EGAVGA.BGI, GRAPH.TPU (thư viện chứa các lệnh vẽ đồ họa) và cácfile cơ bản của TP.

- Đặt chúng ở cùng 1 thư mục (nếu không thì phải lậ p đườ ng dẫn cho GRAPH.TPU tạiOption/Directory/Unit directory và cho EGAVGA.BGI bằng InitGraph)- Đặt lệnh khở i tạo chế độ đồ họa (InitGraph) vào trong chươ ng trình

Ví dụ: Cách đơn giản và hay dùng nhất để khởi tạo đồ họa

Uses Crt,Graph;Var

gd,gm: integer;Begin

gd:=detect;InitGraph(gd,gm,”);

hằng đ/n

xâu r ỗng

..........

..........

.......... /* Các lệnh đồ họa vẽ, xóa ... */CloseGraph; /* k ết thúc đồ họa, quay về chế độ màn hình văn bản bình thườ ng */

End.

Vì sao lại là “đơ n giản và hay dùng nhất” ?- Không cần gõ vị trí tệ p BGI

- Không cần nhớ bảng giá tr ị các chế độ màn hình (có khoảng hơ n 10 cặ p giá tr ị khácnhau tươ ng ứng vớ i các chế độ màn hình khác nhau như EGA, HERCULES, VGA...)

4



- Luôn luôn khở i tạo đượ c chế độ mạnh nhất VGA (16 màu, độ phân giải 640 * 480).Trong các phần tiế p theo ta luôn giả thiết r ằng chế độ đồ họa là VGA

Chỉ để tham khảo: bảng các loại graphics card và chế độ đồ họa tươ ng ứng

GraphDriver GraphMode Số dòng, cộtCGA CGA0 320 * 200--- CGAHi 640 * 200EGA EGALo 640 * 200--- EGAHi 640 * 350VGA VGALo 640 * 200--- VGAMed 640 * 350--- VGAHi 640 * 480

HercMono HercMonoHi 720 * 348...

có tổng cộng 8 giátr ị GraphDriver khác nhau

...

có tổng cộng 30 giátr ị GraphMode khácnhau

...

Chúng ta sẽ chỉ dùng loại

mạnh nhấ t này

3. Hệ tr ục tọa độ màn hình

(639,0)

(0,479)

(0,0)

(639,479)

Trong chế độ đồ họa, chúng ta phải làm việc vớ i một hệ trục tọa độ khác thườ ng:1) Tr ục tung Oy quay xuống dướ i (hệ tr ục Decac nghịch)2) các giá tr ị tọa độ phải là các số nguyên3) Nếu tọa độ vượ t ra ngoài khoảng (0,639) đối vớ i hoành độ và (0,479) đối vớ i tung

độ, thì những gì ta vẽ sẽ không hiển thị trên màn hình

Giải thích:1) Do cấu tạo của màn hình, ta phải chấ p nhận.2) Màn hình chia thành nhiều ô vuông nhỏ (pixel) sắ p xế p theo từng dòng và cột như

hình vẽ.3) Giả sử ta vẽ đoạn thẳng AB, thì chỉ có đoạn CD nằm trong màn hình đượ c hiển thị

5



B

Chú ý: chúng ta không cần nhớ 2 giá tr ị 640 và 480 vì TP đã có 2 hàm GetMaxX vàGetMaxY, chúng tr ả lại giá tr ị lớ n nhất của hoành độ và tung độ đối vớ i mode đồ họa hiệnthờ i: GetMaxX = 639 ; GetMaxY = 479 ;

0,0 1,0 2,0 ... 639,0

0,1

0,2

...

0,479

4. Bảng màu

Vớ i mode đồ họa VGA, bảng màu gồm 16 màu đượ c đánh số từ 0 đến 15 như trong bảngsau. Ta có thể dùng số thứ tự hoặc tên hằng số chỉ màu

Giá trị số Tên hằng số Màu

0 Black Đen1 Blue Xanh da tr ờ i2 Green Xanh lá cây3 Cyan Xanh cẩm thạch4 Red Đỏ 5 Magenta Tía6 Brown Nâu

7 LightGray Xám nhạt8 DarrkGray Xám đậm9 LightBlue Xanh da tr ờ i nhạt

D

CMàn hình

A

mỗi điểm ảnh là1 ô vuông

6



10 LightGreen Xanh lá cây nhạt11 LightCyan Xanh cẩm thạch nhạt12 LightRed Đỏ tươ i13 LightMagenta Tía nhạt14 Yellow Vàng

15 White Tr ắng5. Vẽ điểm

PutPixel(x,y,c); /* x,y : integer ; c: word (kiểu số nguyên dươ ng) */Vẽ 1 điểm ảnh tại tọa độ (x,y) vớ i màu c,GetPixel(x,y):wordHàm GetPixel tr ả lại một số nguyên dươ ng là màu của điểm ảnh ở tọa độ (x,y), nói cáchkhác nó cho biết màu của pixel(x,y) là màu gì.

Ví dụ: Tô toàn màn hình bằng màu đỏ

Uses Crt,Graph;Var

gd,gm: integer;i,j:integer;

Begingd:=detect;InitGraph(gd,gm,”);

for i:=0 to GetMaxX dofor j:=0 to GetMaxY doPutPixel(i,j,red) ;

Readkey;/* Gặ p readkey chươ ng trình sẽ d ừ ng l ại để ta quan sát màn hình. Xem xong ta bấ m

phím bấ t k ỳ để qua l ệnh này */

CloseGraph;End.

Những hằng, biến nào trong chươ ng trình trên có thể đượ c thay bằng những giá tr ị tươ ngđươ ng mà không làm thay đổi chươ ng trình ?Viết chươ ng trình tô một phần tư màn hình (phía trên bên phải) bằng màu xanh da tr ờ iChươ ng trình trên lấ p kín màn hình bằng cách tô theo dòng hay cột ?

7



Ví dụ: vẽ lưới điểm nhấp nháy

uses crt,graph;var

gd,gm,i,j:integer;

x,y:integer; begingd:=detect; initgraph(gd,gm,'');randomize; /* khở i t ạo bộ sinh số ng ẫ u nhiên */

repeatx:=random(100); y:=random(100);if GetPixel(x,y) <>0 then

Putpixel(x,y,0)else PutPixel(x,y,random(GetmaxColor));

delay(2);Until Keypressed;closegraph;

end.

Hàm GetPixel làm chức năng gì trong ví dụ trên ?Thử thay đổi giá tr ị tham số của hàm delay() và random() và quan sát k ết quả

Ví dụ: Vẽ bầu tr ời sao đơn giản

uses crt,graph;var gd, gm, i : integer;BEGIN

gd := 0; initgraph(gd,gm,'C:\TP\BGI');for i := 1 to 1000 do

putpixel(random(640),random(480),random(15)+1);readkey;

END.

Hãy phối hợ p những k ỹ thuật trong 2 ví dụ trên ( hàm random, vòng lặ p Repeat, lệnhGetPixel ... ) để tạo ra bầu tr ờ i sao đẹ p hơ n

Ví dụ: Vẽ đồ thị hàm số y=sin(x)

Uses crt,graph;Vartx,ty,gd,gm,i,j:integer;d,x,y:real;

Begingd:=detect; initgraph(gd,gm,'c:\tp\bgi');setviewport(getmaxX div 2,getmaxY div 2,getmaxX,getmaxY,clipoff);

Hàm tr ả lại số màuhiện có (16)

8



d:=0.001; x:=0; tx:=20; ty:=40;while x<4*pi do begin

putpixel(round(tx*x),-round(ty*sin(x)),yellow);x:=x+d;

end;readln;closegraph;

End.

Hãy giải thích ý ngh ĩ a của tx,ty,d ? Nếu gán d:=0.5 thì k ết quả thay đổi ra sao ?Vì sao phải có dấu tr ừ trong tham số thứ 2 của PutPixel ? Nếu bỏ dấu tr ừ đi thì k ết quả rasao ?Hãy vẽ đồ thị hàm số y = x2 – 2x +1 trong khoảng [-3,3]

Hãy vẽ đồ thị hàm số y = sin 2x trong khoảng [-2π, 2π]

6. Vẽ đoạn thẳng

Line(x1,y1,x2,y2) /* x1,x2,y1,y2: integer */

Vẽ đoạn thẳng nối (x1,y1) vớ i (x2,y2) bằng màu vẽ hiện thờ i ấn định bở i lệnh SetColor gầnnhất. Nếu không có lệnh SetColor nào thì màu vẽ mặc định luôn là màu Tr ắng (white).

Tr ướ c lệnh vẽ đoạn thẳng ta nên đặt màu vẽ cho lệnh Line bằng lệnh

SetColor (c); /* c: word */Chú ý: SetColor chỉ đặt màu vẽ cho các lệnh vẽ đoạn thẳng, hình chữ nhật, đa giác, đườ ngtròn ...mà không có đặt màu tô cho miền khép kín.

Hãy vẽ thêm 2 tr ục tọa độ cho ví dụ mẫu vẽ đồ thị hàm sin ở mục trênHãy làm lại ví dụ “Tô toàn màn hình bằng màu đỏ” nhưng dùng lệnh Line thay cho

PutPixelHãy tô kín hình chữ nhật (50,50,100,100) bằng cách dùng lệnh Line

100,100

50,50

Vẽ và lấ p đầy một hình bình hành bằng các đoạn thẳng xiên như hình (a). Có thể lấ p đầy bằng các đoạn thẳng nằm ngang như hình (b) đượ c không ?

9



(a) (b)

Biết r ằng trên màn hình màu đen chỉ có 1 tam giác màu tr ắng có vị trí và hình dạng bấtk ỳ. Hãy đếm xem có bao nhiêu điểm ảnh nằm bên trong tam giác đó (không tính các cạnh) ?

Hãy vẽ lại đồ thị hàm y = sin(x) nhưng thay vì chấm từng điểm ảnh như ở ví dụ trên thìta nối điểm ảnh này vớ i pixel tiế p theo.

Ngoài ra còn có 2 lệnh vẽ đoạn thẳng khácLineTo(x,y) /* x,y: integer */LineRel(dx,dy) /* x1,x2,y1,y2: integer */

Lệnh LineTo(x,y) vẽ đoạn thẳng nối CP hiện thờ i (xem khái niệm CP ở phần sau) vớ i điểm(x,y), nói cách khác

Line(x1,y1,x2,y2);tươ ng đươ ng vớ i 2 lệnh:

MoveTo(x1,y1); LineTo(x2,y2);Còn LineRel(dx,dy) vẽ đoạn thẳng từ CP đến 1 điểm có độ chênh là (dx,dy), nói cách khác:

LineRel(dx,dy)tươ ng đươ ng vớ i

Line(GetX,GetY,GetX+dx,GetY+dy);Thiết lậ p dạng đoạn thẳng SetLineStyle(dạng,mẫu-tự-tạo,bềdày); { ta bỏ qua mẫ u_t ự _t ạo bằng cách cho 1 giá tr ị nguyên tùy ý}

Dạng:

10



SolidLn 0 Nét ĐặcDottedLn 1 Nét chấm chấmCenterLn 2 Nét chấm gạchDashedLn 3 Nét đứt đoạn

Bề dày có thể nhận giá tr ị từ 1 (bình thườ ng) đến 3 (nét đậm).7. Thiết lậ p chế độ vẽ đè

SetWriteMode (mode); /* mode: word */

Mode Giá tr ị số Tác d ụng

CopyPut 0 Vẽ hình mớ i đè lên hình cũ (chế độ vẽ bình thườ ng)XorPut 1 Màu của từng pixel sẽ đượ c Xor vớ i màu cũ

Trong chế độ XorPut, giá tr ị màu vẽ và màu nền đượ c nhị phân hóa, sau đó làm phép Xor vớ i nhau để ra màu hiển thị.

Xor 0 10 0 11 1 0

Lệnh SetWriteMode có tác động tớ i các lệnh vẽ đườ ng như: Line, LineTo, LineRel,Rectangle, DrawPoly ... và không tác động tớ i các lệnh vẽ đườ ng tròn, elip ...

Ví dụ: Minh họa chế độ xorput

Uses crt, Graph;Var

gd,gm: integer;i,j:integer;

Begingd:=detect;InitGraph(gd,gm,”);

SetFillStyle(1,Brown); /* đặ t chế độ tô đặ c vớ i màu tô là nâu */Bar(100,100,200,200); /* V ẽ hình vuông màu nâu */Readkey;

SetColor(white);SetWriteMode(XorPut);for i:=100 to 200 do line(100,i,200,i) ; /* hình vuông đổ i thành màu gì ? */Readkey;

CloseGraph;End.

11



Sau lệnh Readkey thứ nhất chươ ng trình dừng lại, lúc đó trên màn hình có gì ?Sau lệnh Readkey thứ 2 chươ ng trình dừng lại, lúc đó trên màn hình có gì ? Tại sao ?

Chế độ XorPut đặc biệt hay đượ c dùng để vẽ hình chuyển động vì dù hình mớ i là gì thì sau2 lần vẽ đè vớ i XorPut hình cũ cũng sẽ đượ c khôi phục nguyên tr ạng (vẽ hình chuyển động

không để lại vết)

Giải thích nhận định trên

8. Cửa sổ ViewPort của TP

ViewPort (của đồ họa Pascal) là 1 vùng hình chữ nhật trên màn hình. Để thiết lậ p ViewPortta dùng lệnh:

SetViewPort(x1,y1,x2,y2,clip);

x1,x2,y1,y2: tọa độ của ViewPort; clip = true (không cho phép vẽ ra ngoài) hoặc false.Chú ý là sau khi đã thiết lậ p ViewPort thì gốc tọa độ đượ c tự động chuyển về (x1,y1).

ViewPort: clip=off ViewPort: clip=on

Xóa nội dung bên trong ViewPort: ClearViewPort; Loại bỏ hẳn ViewPort, tr ở về chế độ làm việc toàn màn hình: ClearDevice; Lệnh này cũngdùng để xóa màn hình và đưa CP về (0,0)

9. Con tr ỏ trong chế độ đồ họa (CP: Current Pointer)

Ta không nhìn thấy CP trên màn hình, nhưng TP luôn theo dõi vị trí của CP bằng cặ p hàmGetX, GetY: tr ả lại tọa độ hiện thờ i của CPMoveto(x,y): di chuyển CP tớ i (x,y)MoveRel(dx,dy): di chuyển CP tớ i vị trí mớ i cách vị trí cũ 1 độ chênh là (dx,dy)

(x2,y2)

(x1,y1)

12y

xO

Moverel (dx,dy)

dx

dy



Lệnh có liên quan đến CP:- LineTo(x,y): vẽ đoạn thẳng nối từ CP đến (x,y), đồng thờ i chuyển CP đến đó.- LineRel(dx,dy): vẽ đoạn thẳng nối từ CP đến vị trí mớ i có độ chênh là (dx,dy) vàkéo CP tớ i đó.

10. Vẽ hình chữ nhật Vẽ hình chữ nhật có đỉnh trên bên trái là (x1,y1), đỉnh dướ i phải (x2,y2) và các cạnh songsong vớ i 2 tr ục:Rectangle(x1,y1,x2,y2); /* x1,y1,x2,y2: integer */

Để vẽ và tô hình chữ nhật đặc ta dùng Bar(x1,y1,x2,y2); /* x1,y1,x2,y2: integer */màu tô và mẫu tô phải đượ c thiết lậ p từ tr ướ c bằng lệnhSetFillStyle(Pattern, Color);

Pattern Giá trị số Mẫu tô

EmptyFill 0 Màu nền (= để tr ống)SolidFill 1 Màu đặcLineFill 2 Gạch dọcLtSlashFill 3 Tô sọc chéo thưaSlashfill 4 Tô sọc chéo dày.... ...UserFill 12 ngườ i lậ p trình tự định ngh ĩ a bằng lệnh SetFillPattern()

Lệnh SetFillStyle() đặt mẫu tô cho các lệnh tô hình kín như:• Rectangle: hình chữ nhật• Bar: hình chữ nhật đặc• Bar3D: hình hộ p• FillPoly: đa giác• PieSlice: quạt tròn

Ví dụ: Vẽ bàn cờ

uses crt,graph;

13



Hãy vẽ một hình vuông ở tâm màn hình, cho nó từ từ phình to ra đến khi chạm rìa mànhình thì dừng lại. Sau đó co lại để tr ở về kích thướ c ban đầu.

11. Đa giác

Vẽ đa giácDrawPoly(n,P);

n: số đỉnh đa giác +1P: tham số chứa tọa độ các đỉnh của đa giác

Tô đa giác bằng lệnh sau:FillPoly(n,P); /* n và P như trên. Chú ý là n không cần cộng 1*/ Xem các ví dụ sau để hiểu rõ

Ví dụ: Vẽ các ngũ giác ngẫu nhiên

Uses crt,graph;Type

Dinh = Record /* Đỉnh đa giác */x,y:integer;End;

(b)(a)

15



Var

gd,gm:integer;i:integer;dagiac: array[1..6] of Dinh;

Begingd:=detect;InitGraph(gd,gm,'');Randomize;

RepeatSetColor(random(GetMaxColor)); /* màu đượ c chọn ngẫu nhiên */for i:=1 to 5 do begin

dagiac[i].x:=random(getMaxX); /* tọa độ đỉnh đượ c chọn ngẫu nhiên */dagiac[i].y:=random(getMaxY);

end;dagiac[6]:=dagiac[1];DrawPoly(6,dagiac);Delay(1000);

Until KeyPressed;CloseGraph;

End.

Chú ý lệnh dagiac[6]:=dagiac[1] . Để vẽ đa giác kín N đỉnh ta phải tạo ra đỉnh thứ N+1trùng vớ i đỉnh đầu.

Các đa giác trong chươ ng trình trên đè chồng lên nhau và làm đầy màn hình. Hãy sửachươ ng trình để chúng hiện lên r ồi tự tắt. Hãy sửa để luôn luôn lưu lại trên màn hình 3 đagiác mớ i nhất.

Ví dụ: Vẽ và tô các ngũ giác ngẫu nhiên

Uses crt,graph;Type

Dinh = Recordx,y:integer;

End;

Var gd,gm:integer;i:integer;dagiac: array[1..6] of Dinh;

Begingd:=detect;InitGraph(gd,gm,'');Randomize;

RepeatSetColor(random(GetMaxColor));SetFillStyle(SolidFill,random(GetMaxColor));

16



for i:=1 to 5 do begin

dagiac[i].x:=random(getMaxX);dagiac[i].y:=random(getMaxy);

end;dagiac[6]:=dagiac[1];DrawPoly(6,dagiac);FillPoly(6,dagiac);Delay(2000);

Until KeyPressed;CloseGraph;

End.

Chú ý quan sát ta thấy, vớ i các đa giác lõm lệnh FillPoly tính toán tất cả các chỗ tự cắt vàsau đó tô riêng từng phần. Màu tô và mẫu tô xác định bở i SetFillStyle. Dướ i đây là 1 ngũ

giác lõm vớ i các cạnh tự cắt đượ c tô bở i FillPoly

12. Tô màu miền kín

FloodFill(x,y,c); /* x,y : integer; c: word */Vùng cần tô đượ c nhận dạng nhờ 2 yếu tố:

- đườ ng biên khép kín đồng màu (ký hiệu màu là c) - điểm (x,y) là một điểm bất k ỳ nằm bên trong vùng cần tô.

Màu tô và mẫu tô đượ c ấn định bở i SetFillStyle

Ví dụ: VẼ LÁ CỜ ĐỎ SAO VÀNG

uses crt,graph;

(x,y)(x,y)

17



var gd, gm, i, goc, r : integer; p : array[1..5,1..2] of integer; { toạ độ các đỉ nh ngôi sao }

BEGIN gd := 0; initgraph(gd,gm,'');

goc := 18; r := 100;for i := 1 to 5 do begin

p[i,1] := round(r*cos(goc*pi/180)); { hoành độ của đỉ nh thứ i } p[i,2] := - round(r*sin(goc*pi/180)); { tung độ của đỉ nh thứ i }goc := goc + 2*72;

end;

SetFillStyle(1,red); {vẽ lá cờ là hình chữ nhật màu đỏ } Bar(100,100,540,380);

SetViewPort(320,240,600,400,false); {chuyể n g ố c toạ độ ra giữ a màn hình} SetColor(yellow);SetFillStyle(1,yellow);FillPoly(5,p); {2 l ệnh này tô hình ngôi sao vàng }

FloodFill(0,0,yellow);readkey;

END.

Vì sao trong công thức tính tung độ đỉnh thứ i của ngôi sao lại có dấu tr ừ ? Nếu bỏ dấutr ừ này đi thì hiện tượ ng gì xảy ra ?

Vì sao phải cần 2 lệnh mớ i tô đượ c ngôi sao ? Nếu bỏ lệnh FloodFill đi thì k ết quả sẽ rasao ? Hoặc nếu chỉ bỏ đi lệnh FillPoly thì trên màn hình sẽ có gì ?Lệnh FillPoly ở trên tô màu một ngũ giác, đó là ngũ giác nào ?Giải thích các lệnh: goc := 18; goc := goc + 2*72;Vì sao không vẽ và tô đa giác 10 đỉnh (123456789-10) ? thay vào đó ví dụ trên vẽ đagiác nào ?

y

13. Vẽ cung, đườ ng trònVẽ đườ ng tròn tâm (x,y) bán kính r :

Circle(x,y,r); /* x,y: integer; r: word */

Vẽ cung tròn: Arc(x,y, g1,g2,r);

A 1

B E 3

5

92 10

180

O 4

C D

x

76

8

18



x,y: integer - tọa độ tâm đườ ng tròn

g1,g2: word – góc bắt đầu và góc cuốicủa cung tròn (tính bằng độ)

r: word – bán kính

Để vẽ hình quạt tròn, đầu tiên ta vẽ cung tròn, sau đó gọi thủ tụcGetArcCoords(VAR ArcCoords: ArcCoodsType);để lấy tọa độ 2 đầu mút (A,B) của cung.Cuối cùng ta vẽ hai đoạn thẳng nối chúng vớ i tâm Ocủa đườ ng tròn

Vớ i kiểu ArcCoodsType đượ c định ngh ĩ a như sau:Type

ArcCoodsType = RECORD

x,y:integer; xStart,yStart:integer; xEnd,yEnd:integer;

END trong đó (x,y) là tọa độ tâm O, (xStart,yStart) là tọa độ điểm đầu B của cung, (xEnd,yEnd)là điểm cuối A.

Ví dụ: Vẽ quạt tròn

uses crt,graph;var

gd,gm:integer;a:ArcCoordsType;x,y,g1,g2,r: integer;

Begin

gd:=detect; initgraph(gd,gm,'');x:=GetMaxX div 2; y:=GetMaxY div 2;{ tâm đặ t chính giữ a màn hình }g1:=30; g2:=330; {góc bắ t đầu, góc k ế t thúc } r:=100;arc(x,y,30,330,100);GetArcCoords(a);line(x,y,a.xStart,a.yStart);line(x,y,a.xEnd,a.yEnd);readkey;closegraph;

End.

A

g2

g1O

B

Cải tiến chươ ng trình trên để vẽ đầu cá đóng - mở miệng liên tục

19



Viết chươ ng trình vẽ hình tr ăng lưỡ i liềm và khuyên

Vẽ cung elip tâm (x,y), bán tr ục lớ n xr, bán tr ục bé yr, góc bắt đầu và góc k ết thúc là g1,g2Ellipse(x,y,g1,g2,xr,yr)

yr

xr

Vẽ và tô hình quạt tròn:PieSlice(x,y, g1,g2, r);

Ý ngh ĩ a các tham số giống như lệnh Arc

Để tô màu ellip, cũng như đườ ng tròn, ta dùng thủ tục:FillEllipse(x,y,xr,yr); {x,y:integer; xr,yr: word}

Để tô một cung ellip ta gọi thủ tụcSector(x,y,StAngle,EndAngle,xr,yr); {x,y: integer; StAngle,EndAngle, xr,yr: word}

20



Ví dụ: VẼ BÓNG CHUYỂN ĐỘNG KIỂU BẬT TƯỜNG

uses crt,graph;var gd,gm,x,y,dx,dy,r : integer;BEGIN

gd := 0; initgraph(gd,gm,'');x := 100; y := 100; dx := -6; dy := 5; r := 30;repeat

setcolor(yellow);circle(x,y,r); {vẽ đườ ng tròn màu vàng} delay(20);setcolor(0);

circle(x,y,r); {vẽ đườ ng tròn màu trùng màu nề n <=> xoá }

if (x>=640-r) or (x<r) then dx:=-dx; {nế u chạm cạnh trái/phải thì đổ i hướ ng}if (y>=480-r) or (y<r) then dy:=-dy; {nế u chạm cạnh trên/d ướ i thì đổ i hướ ng} x := x + dx; y := y + dy; {cậ p nhật toạ độ }

until keypressed; {có phím nhấ n thì d ừ ng} END.

Vị trí xuất phát, kích thướ c bóng là gì ? biến nào quy định hướ ng xuất phát của bóng ?

Chươ ng trình trên dùng k ỹ thuật gì để vẽ hình chuyển động ?Làm sao để tăng/giảm tốc độ bóng ?

Ví dụ: Vẽ đồng hồ với kim giây chuyển động

Uses crt,graph;Vargd,gm:integer;x,y,a,b,r:integer;c,i,x1,x2,y1,y2:integer;g,d:real;

Begingd:=detect; initgraph(gd,gm,'c:\tp\bgi');a:=GetMaxX div 2; b:=GetmaxY div 2;

21



Setcolor(Yellow);SetWriteMode(Xorput);r:=150;Circle(a,b,r);{V ẽ các vạch chia}c:=5; {chiề u dài ½ vạch chia} d:=pi/6; g:=0;while g< 2*pi do begin

g:=g+d;x1:=a+round((r-c)*cos(g)); x2:=a+round((r+c)*cos(g));y1:=b-round((r-c)*sin(g)); y2:=b-round((r+c)*sin(g));line(x1,y1,x2,y2); {V ẽ vạch chia}

end;{V ẽ kim giây chuyể n động}x:=a; y:=b-r; line(a,b,x,y);g:=pi/2; d:=pi/30;repeat

line(a,b,x,y);g:=g-d;x:=round(a+r*cos(g)); y:=round(b-r*sin(g));line(a,b,x,y);delay(1000);

until KeyPressed;closegraph;

End.

Ý ngh ĩ a các biến a,b,x,y, r, d là gì ?Chươ ng trình trên dùng k ỹ thuật gì để vẽ kim giây chuyển động ? Nếu là vẽ kim phút thì phải sửa chươ ng trình trên như thế nào ?Hãy vẽ đồng hồ vớ i 2 kim cùng chuyển động: kim giây và kim 1/10 giây

14. Viết chữ (x,y)

B C D E F G OutText(s); {s: string} OutTextXY(x,y,s); {x,y:integer; s: string}

Lệnh OutText(s) hiển thị xâu ký tự s tại vị trí CP, không di chuyển CP. Lệnh OutTextXYhiển thị xâu ký tự s tại vị trí (x,y). Các phông chữ (font) khác nhau nằm trên các file *.CHR,nên để chúng tại cùng vị trí vớ i file *.BGI. Chọn kiểu font chữ bằng lệnh sau:SetTextStyle(Font, Direction, Size);

22



Chiều viết Giá tr ị số

Tác dụngTên font Giá tr ị số

Hệ số phóng to Size nhận các giá tr ị từ 1 đến 10.

Ví dụ: Vẽ chữ có bóng

uses crt,graph;

Var gd,gm,i:integer;

Begingd:=detect; initgraph(gd,gm,'');setTextStyle(GothicFont,0,10);SetColor(DarkGray); {1} for i:=1 to 10 do outTextxy(100+i,100-i,'Graphic');SetColor(LightGray); {2} outTextxy(100,100,'Graphic');

readln;closegraph;End.

Màu chữ và màu bóng có giống nhau không ? giải thích tác dụng của lệnh {1} và {2} ?nếu hoán vị 2 lệnh đó thì sao ?Làm sao để điều khiển chữ đổ bóng sang hướ ng trái/phải, lên trên/xuống dướ i như cáchình dướ i đây?

Viết chươ ng trình để các dòng chữ chuyển động từ hai bên ra giữa / r ơ i từ trên xuống ...

DefaultFont 0

HorizDir 0 viết ngangTriplexFont 1 VertDir 1SmallFont 2SansSerifFont 3GothicFont 4

viết theo chiềuthẳng đứng

Tham số font nhận các giá tr ị sau Tham số Direction nhận các giá tr ị sau

23



15. Cắt dán hình

Để lưu một hình vào bộ nhớ , ta phải lưu cả diện tích hình chữ nhật bao nó

Memory

A B C

(x1,y1)

(x2,y2)

Để tính toán kích thướ c vùng nhớ cần dùng để chứa hình, ta gọi hàmImageSize(x1,y1,x2,y2) ; {x1,y1,x2,y2: integer }

vớ i (x1,y1,x2,y2) là tọa độ hình chữ nhật bao quanh hình cần lưu tr ữ. Chú ý là TP khôngcho phép lưu tr ữ một hình có diện tích quá lớ n.

Sau đó, ta xin trình dịch cấ p phát vùng nhớ này bằng cách gọi thủ tục

GetMem(p: pointer, n: word) ;

Thủ tục này xin cấ p phát 1 vùng nhớ n byte (n phải đượ c dự trù tr ướ c bằng cách gọi hàmImageSize), r ồi lưu địa chỉ vùng nhớ đó vào con tr ỏ p. Chú ý: sau khi dùng xong nên giải

phóng vùng nhớ này bằng FreeMem(p,n); nếu không sau vài lần gọi GetMem sẽ cạn dunglượ ng nhớ .

Bướ c tiế p theo, ta dùng thủ tụcGetImage(x1,y1,x2,y2, p) ; {x1,y1,x2,y2: integer ; p: pointer}

để sao chép các điểm ảnh trên màn hình nằm trong phạm vi hình chữ nhật (x1,y1,x2,y2) vàovùng nhớ xác định bở i con tr ỏ p;

Khi cần thiết, ta dán ảnh đang lưu trong bộ nhớ ra màn hình bằng thủ tụcPutImage(x,y,p,mode); {x,y: integer; p: pointer; mode: word}

Lệnh này sẽ copy ảnh đang lưu trong bộ nhớ xác định bở i p vào vị trí (x,y) theo kiểu modeTham số mode nhận các giá tr ị như sau

Mode Giá tr ị số Tác d ụng

CopyPut 0 Vẽ hình mớ i đè lên hình cũ XorPut 1 Màu của từng pixel sẽ đượ c Xor vớ i màu cũ

24



Ví dụ: Cắt dán ảnh

uses crt,graph;var

gd,gm:integer;i,x,y,dx,dy,canh:integer;

p:pointer; {con tr ỏ tr ỏ t ớ i vùng nhớ dùng để cấ t giữ ảnh} size:word;

Begin

gd:=detect; initgraph(gd,gm,'');randomize;dx:= GetMaxX div 2; dy:= GetMaxY div 2;SetViewPort(0,0,dx,dy,true);for i:=1 to 40 do {V ẽ các vòng tròn ng ẫ u nhiên trong phần t ư màn hình trên bên trái}

beginx:=random(dx); y:=random(dy);SetColor(random(GetMaxColor));circle(x,y,random(dy));

end;

SetViewPort(0,0,GetMaxX,GetMaxY,false);SetColor(White);x:=50; y:=50; canh:=100; { ảnh cần l ư u là 1 hình vuông cạnh dài 100 pixel} Rectangle(x,y,x+canh,y+canh); {vẽ đườ ng bao quanh phạm vi ảnh cần l ư u} Size:=ImageSize(x,y,x+canh,y+canh);GetMem(p,size);GetImage(x,y,x+canh,y+canh,p^);PutImage(x+dx,y,p^,CopyPut);readkey;

closegraph;End.

25



Giải thích ý ngh ĩ a của các biến: canh,x,y. Tác dụng của 2 lệnh SetViewPort trongchươ ng trình trên là gì ? thử thay đổi giá tr ị tham số cuối cùng (tham số boolean) của chúngvà quan sát k ết quả Nếu thay CopyPut bằng XorPut trong lệnh PutImage(x+dx,y,p^,CopyPut); thì có gì thayđổi không ? Vì sao ?

16. Nhận biết phím đượ c ấn

Trong khi chươ ng trình đang chạy, ngườ i dùng có thể ấn các phím để điều khiển (vídụ trong các game sử dụng bàn phím để điều khiển hành động của nhân vật). Để nhận biết

phím nào đượ c ấn, một trong những k ỹ thuật TP hay sử dụng là dùng hàm Readkey. Đối vớ inhững phím đặc biệt như các phím mũi tên, lần đọc bằng Readkey thứ nhất sẽ tr ả lại giá tr ị 0 để ta nhận biết đó là phím mở r ộng, lần Readkey thứ hai mớ i đọc ra mã quét mở r ộng củachúng phím đó. Đối vớ i phím bình thườ ng (như Esc, các phím chữ cái ... ) thì chỉ cần mộtlần đọc bằng Readkey.

Ví dụ: Hộp chuyển động theo sự điều khiển của người dùng

{H ộ p vuông d ịch chuyể n theo phím mũi tên mà ng ườ i dùng bấ m}Uses crt,graph;Var

gd,gm:integer;canh,x,y,d:integer;ch:char;

Procedure hộ p(x,y:integer);

Begin rectangle(x-canh,y-canh,x+canh,y+canh); {V ẽ hộ p} delay(d);rectangle(x-canh,y-canh,x+canh,y+canh); {Xóa hộ p}

End;Begin

gd:=detect; initgraph(gd,gm,'c:\tp\bgi');x:=100; y:=100; {V ị trí ban đầu của hộ p } setWriteMode(xorput);d:=50; canh:=10;

RepeatRepeat

hộ p(x,y);Until Keypressed;ch:=readkey;if ch=#0 then {một phím mở r ộng đ ã đượ c ấ n } begin

ch:=readkey;case ch of #72: y:=y-10; {phím }

#80: y:=y+10; {phím } #75: x:=x-10; {phím } #77: x:=x+10; {phím }

26



BEGIN gd := 0; initgraph(gd,gm,'');x := 30; y := 200; dx := 3; a := 30; r := 30; {dx là chiề u dài 1 bướ c tiế n của bánh xe} da:=round(dx/r*180/pi); {da là góc quay của nan hoa t ươ ng ứ ngvớ i bướ c tiế n dx} repeat

banhxe(x,y,r,yellow,12,a); {vẽ bánh xe} delay(40);

banhxe(x,y,r,black,12,a); {vẽ bánh xe vớ i màu nề n để xoá}

if (x>=640-r) then x := r; {nế u bánh xe đế n mép bên phải thì quay l ại bên trái} x := x + dx;if a < 0 then a := a + 360;a := a - da; {quay ng ượ c chiề u d ươ ng nên phải tr ừ }

until keypressed;

END.

Trong Procedure banhxe(), dx,dy là tọa độ tươ ng đối của đầu nan hoa trong hệ tọa độ nào ? (gốc tọa độ ở đâu ? tr ục Oy hướ ng nào ?)

Trong procedure banhxe, 360 div n là góc gì ? tại sao có dấu tr ừ trong lệnh dy :=-round(r* sin(goc * pi/180)); tọa độ tâm bánh xe ở đâu ?

Tại sao phải gán da:=round(dx/r*180/pi); thay vào đó, nếu gán những giá tr ị cụ thể như

3,6,9 độ cho góc quay da thì k ết quả ra sao ?

Hãy sửa chươ ng trình để bánh xe lăn ngượ c lại mỗi khi chạm đến 2 biên trái/phải

Hãy dùng k ỹ thuật XorPut để xóa bánh xe trong procedure banhxe

Ví dụ: Vẽ bánh xe (2)

uses crt,graph;var gd,gm:integer;r,x,y,direct,buoc:integer; gia_so_goc,goc:real;

procedure ve_banh_xe;var x1,y1,x2,y2,x3,y3:integer;

beginx1:=x+round(r*cos(goc));y1:=y-round(r*sin(goc));x2:=x+round(r*cos(goc+2*pi/3));y2:=y-round(r*sin(goc+2*pi/3));

x3:=x+round(r*cos(goc-2*pi/3));y3:=y-round(r*sin(goc-2*pi/3));Circle(x,y,r); line(x,y,x1,y1);line(x,y,x2,y2);line(x,y,x3,y3);delay(30); setcolor(0);

28



Circle(x,y,r); line(x,y,x1,y1);line(x,y,x2,y2);line(x,y,x3,y3); {xoa}delay(30);goc:=goc-gia_so_goc*direct; setcolor(yellow);

end;

begindirect:=1; buoc:=5;gd:=detect; initgraph(gd,gm,'c:\tp\bgi');x:=100; goc:=0;r:=30; y:=200;gia_so_goc:=buoc/r; setcolor(yellow);repeatve_banh_xe;if (r> x+direct*buoc) or (x+direct*buoc > getmaxX-r) then direct:=-direct;x:=(x+direct*buoc);

until Keypressed;

closegraph;end.

Ý ngh ĩ a các biến r,x,y,direct,buoc, gia_so_goc, goc là gì ? Nếu muốn bánh xe lăn nhanh hơ n / to hơ n thì phải thay đổi giá tr ị biến nào

Ví dụ: Vẽ bầu tr ời sao

Uses crt,graph;Vargd,gm:integer;s:array[1..100] of pointType;n,i,j:integer;

procedure star(a,b:integer); {một ngôi sao lóe sáng} var i:integer;beginfor i:=2 to 10 do begin

setcolor(random(GetMaxColor));circle(a,b,i); delay(100);setcolor(0); circle(a,b,i);

end;end;

Begingd:=detect;initgraph(gd,gm,'c:\tp\bgi');setcolor(Yellow); n:=100;

Randomize;for i:=1 to n do {n ngôi sao l ần l ượ t hiện lên} begin

29



delay(50);s[i].x:=random(GetmaxX);s[i].y:=random(GetmaxY);

putpixel(s[i].x,s[i].y,yellow);end;

i:=0;j:=0;{các ngôi sao l ần l ượ t lóe sáng}repeat

i:=i mod n +1; j:=j mod 10 +1;if j <> 10 then putpixel(s[i].x,s[i].y,0)else star(s[i].x,s[i].y);delay(50);s[i].x:=random(GetmaxX);s[i].y:=random(GetmaxY);

putpixel(s[i].x,s[i].y,yellow);

untilkeypressed;

closeGraph;End.

Ví dụ: Vẽ hộp chuyển động theo sự điều khiển của người dùng

{ H ộ p vuông chuyể n động theo phươ ng ngang, chạm vào 2 biên và nả y ng ượ c l ại. N ế u ng ườ i dùng bấ m phím mũi tên cùng chiề u vớ i chiề u chuyể n động của hộ p thì hộ p t ă ng

t ố c độ , ng ượ c l ại sẽ giảm t ố c độ.

Bấ m phím mũi tên : qu ỹ đạo hộ p sẽ đượ c hạ xuố ng / nâng lên }

Uses crt,graph;VAR gd,gm:integer;canh,buoc,direct,x,y,d:integer;ch:char;

Procedure hop(x,y:integer); beginrectangle(x-canh,y-canh,x+canh,y+canh);delay(d);

rectangle(x-canh,y-canh,x+canh,y+canh);end;

BEGINgd:=detect; initgraph(gd,gm,'c:\tp\bgi');x:=100;y:=100; setwritemode(xorput);d:=50; direct:=1; buoc:=2; canh:=10;Repeatrepeathop(x,y);

if (0<x+direct*buoc) and (x+direct*buoc<GetmaxX) then x:=x+direct*buocelse direct:=direct*(-1);

30



until Keypressed;ch:=readkey;if ch=#0 then beginch:=readkey;case ch of #72: if y>10 then y:=y-10;#80: if y<getmaxY-10 then y:=y+10;#75: if direct=1 then

begin if buoc>1 then dec(buoc); { hãm phanh }end

else { direct=-1} inc(buoc); { tăng tốc }#77: if direct=-1 then

begin if buoc>1 then dec(buoc); { hãm phanh }end

else inc(buoc); { tăng tốc }end;

end;Until ch=#27;

closegraph;END.

31



Chươ ng II: Một số thuật toán đồ họa cơ bản

I. Vẽ đoạn thẳng

Xét đoạn thẳng y = m.x +b có hệ số góc 0<m<1, ta chọn điểm đầu và điểm cuối sao cho dx=x2-x1>0. Làm sao để vẽ đoạn thẳng nối (x1,y1) (x2,y2) trong khi ta chỉ có thể ra lệnh chomàn hình vẽ từng điểm ảnh (kiểư như PutPixel của TP)?

Bản chất của quá trình này là sự r ờ i r ạc hóa và nguyên hóa một đối tượ ng thực (ở đây làđoạn thẳng thực - đoạn thẳng toán học) trên màn hình sao cho cuối cùng ta có tậ p các Pixeltrông “giống” đối tượ ng nhất.

Bản chất của các thuật toán vẽ đoạn thẳng là đi tìm tậ p các pixel liền nhau sao chotrông chúng “giống” vớ i đoạn thẳng thực nhất

Thế nào là giống ?- Liên tục (không đứt đoạn)- Gần vớ i đoạn thẳng thực (đoạn thẳng toán học) nhấtHơ n nữa, còn vấn đề tối ưu tốc độ, ngh ĩ a là thuật toán phải tô các pixel trong thờ i gian

nhanh nhấtBài toán: ta phải vẽ đoạn thẳng y = m.x +b có hệ số góc 0<m<1, dx>0 (các tr ườ ng hợ p

khác đều có thể quy về tr ườ ng hợ p này)Đầu tiên ta nhận xét, vớ i các đoạn thẳng dạng này, nếu (xi, yi) là điểm ảnh đã vẽ đượ c ở

bướ c thứ i (điểm màu đen) thì- chắc chắn xi+1 = xi +1- yi+1 =yi hoặc yi+1 =yi +1

do đó điểm ảnh ở bướ c (i+1) tiế p theo chỉ có thể là 1 trong 2 tr ườ ng hợ p như hình vẽ. Vấnđề quy về việc chọn điểm nào trong hai điểm đó.

x1 x2

y2

y1

Làm sao vẽ đoạn thẳng nối2 điểm này

1

2

xi

yi

xi+1

(xi+1, yi)

(xi+1, yi+1)

32



1. Thuật toán DDA vẽ đoạn thẳngViệc quyết định chọn yi+1 là yi hay yi+1 dựa vào phươ ng trình của đoạn thẳng thực.

Ta sẽ tính tọa độ của điểm y = m (xi +1) + b thuộc về đoạn thẳng thực, sau đó chọn điểmnào gần vớ i nó nhất trong 2 điểm, ngh ĩ a là

yi+1 = round(y) = round(m.xi+1 +b) Như vậy sẽ tốn 1 phép nhân và 1 phép cộng số thực. Để cải thiện tốc độ, ngườ i ta dùng cáchsau để khử phép nhân. Nhận xét r ằng:

yi = m.xi + byi+1 = m.xi+1 +b ⇒ yi+1 = yi + m

Ví dụ: Cho A(12,20) và B(22,27), ta có m=0.7

Begin

x < x2 ?

Yes

NoEnd

x:=x+1; y:=y+m;PutPixel(x,round(y));

m:=dy/dx ;x:=x1; y:=y1; putpixel(x,round(y));

Lư u đồ thuật toánDDA

(xi+1, y)

y

(xi+1, round(y))

(xi , yi)

33



i xi yi y

0 12 20 201 13 21 20.72 14 21 21.43 15 22 22.14 16 23 22.85 17 24 23.56 18 24 24.27 19 25 24.98 20 26 25.69 21 26 26.310 22 27 27

Thuật toán DDA vẽ đoạn thẳng

{ V ẽ đ oạn thẳ ng trong tr ườ ng hợ p 0<m<1, dx >0}uses crt,graph;vargd,gm:integer;i,x1,y1,x2,y2,x:integer;y,m:real;

Begingd:=detect; initgraph(gd,gm,'');

Randomize;Repeat {vẽ các đ oạn thẳ ng ng ẫ u nhiên} x1:=random(GetMaxX);x2:=x1+random(GetMaxX-x1);y1:=random(GetMaxY);y2:=y1+random(x2-x1);x:=x1; y:=y1;m:=(y2-y1)/(x2-x1);

putpixel(x,round(y),white);for i:=x1 to x2 do begin

x:=x+1;y:=y+m;

putpixel(x,round(y),white);end;delay(1000);

Until Keypressed;closegraph;

End.

34



2. Thuật toán Bresenham vẽ đoạn thẳng

Trong hình vẽ (xi+1,y) là điểm thuộc đoạn thẳng thực, ta có: y = m(xi+1) + b. Giả sử ở bướ ci ta đã xác định đượ c điểm (xi,yi).Đặt

d1 = y – y1 ;d2 = (yi +1) - y ;

Việc chọn điểm tiế p theo (xi+1, yi+1) là S hay P tùy thuộc vào việc d1 lớ n hơ n hay nhỏ hơ n d2,nói cách khác là phụ thuộc vào dấu của (d1 – d2)• Nếu d1 – d2 <0, ta sẽ chọn S, tức là yi+1 = yi •

Tr ườ ng hợ p còn lại: d1 – d2 >0, ta sẽ chọn P, tức là yi+1 = yi+1Đặt pi = dx (d1 – d2).

Thay d1 = y – y1 ; d2 = (yi +1) – y vào ta có pi = dx (2y - 2yi -1)

Thay y = mxi+b = dy(xi+1)/dx + b vào ta có pi = 2dx [dy(xi+1)/dx +b] – 2yidx –dx

= 2xidy – 2yidx +Cvớ i C = 2dy + (2b-1)dx là hằng số.

Ta nhận xét r ằng, nếu tại bướ c thứ i ta xác định đượ c dấu của pi thì sẽ xác định đượ c điểm

cần tô ở bướ c i+1.Làm sao để tính giá tr ị của pi ? ta dùng phươ ng pháp “lũy tiến” như sau.Ta có:

pi+1 –pi = (2xi+1dy – 2yi+1dx +C) - (2xidy – 2yidx +C) = 2dy -2dx(yi+1 – yi)• Nếu pi<0 thì điểm đượ c chọn là S, tức là yi+1 = yi ⇒ pi+1 = pi +2dy• Nếu pi>0 thì điểm đượ c chọn là P, tức là yi+1 = yi+1 ⇒ pi+1 = pi +2dy -2dx

Cuối cùng, giá tr ị p0 đượ c tính từ điểm ảnh đầu tiên (x0, y0) theo công thức sau p0 = 2x0dy – 2y0dx + cThay giá tr ị của c vào, chú ý r ằng điểm đầu (x0, y0) cũng thuộc đoạn thẳng thực nên y0 =mx0 + b = x0dy/dx + b, suy ra

p0 = 2dy -dx

tóm lại là:

xi+1

S

(xi+1,y)

Pyi+1d2

yd1

yi

xi

35



...y0

...y1

p1 y2

p2 p0

Ví dụ:Cho A(12,20) và B(22,27), ta có

dx = 22 – 12 = 10 ; dy = 27 – 20 = 7;c1 = 2dy = 14 ; c2 = 2(dy-dx) = -6;

p0 = 2Dy – dx = 4

i xi yi pi

0 12 20 41 13 21 -22 14 21 123 15 22 64 16 23 05 17 24 -66 18 24 87 19 25 28 20 26 -49 21 26 1010 22 27 4

36



Thuật toán Bresenham vẽ đoạn thẳng

{ V ẽ đ oạn thẳ ng trong tr ườ ng hợ p 0<m<1, dx >0}

uses crt,graph;vargd,gm:integer;i,x1,y1,x2,y2,dx,dy,p,c1,c2,x,y:integer;

Begingd:=detect; initgraph(gd,gm,'');Randomize;Repeatx1:=random(GetMaxX);x2:=x1+random(GetMaxX-x1);

y1:=random(GetMaxY);y2:=y1+random(x2-x1);

{vẽ đ oạn thẳ ng (x1,y1) (x2,y2) }

Lư u đồ thuật toán

Bresenham

x < x2 ?

p:=2dy - dx ;

c1=2dy;c2=2(dy-dx);x:=x1; y:=y1 ; putpixel(x,y);

Yes

NoEnd

Nop < 0 ?

Yes

p:=p+c1; p:=p + c2; y:=y+1;

x:=x+1;PutPixel(x,y);

Begin

37



dx:=x2-x1;dy:=y2-y1;

p:=2*dy - dx;c1:=2*dy;c2:=2*(dy-dx);x:=x1;y:=y1;

putpixel(x,y,white);for i:=x1 to x2 do beginif p<0 then p:=p+c1 else begin

p:=p+c2; y:=y+1;end;x:=x+1;

putpixel(x,y,white);end;delay(1000);

Until Keypressed;closegraph;

End.

3. Thuật toán MidPoint vẽ đoạn thẳng

O: điểm giữa

Pyi+1

S

yi

xi xi+1

Thuật toán này thực chất là 1 cách diễn giải khác của thuật toán Bresenham. Ta lựa chọnyi+1 là yi hay yi+1 bằng cách so sánh trung điểm của O của PS vớ i đườ ng thẳng thực• Nếu O nằm phía dướ i đườ ng thẳng, ta chọn P• Nếu O nằm phía trên, ta chọn S

Phươ ng trình đườ ng thẳng thực: Ax + By + C = 0vớ i A = y2 – y1; B = x1 – x2; C = x2y1 – x1y2 ;Đặt F(x,y) = Ax + By + C, ta biết r ằng• F(x,y) <0 nếu điểm (x,y) nằm phía trên đườ ng thẳng• F(x,y) =0 nếu điểm (x,y) thuộc đườ ng thẳng

• F(x,y) >0 nếu điểm (x,y) nằm phía dướ i đườ ng thẳngvì vậy, vấn đề quy về việc xét dấu của pi = 2F(O) = 2F(xi +1,yi +1/2)

• Nếu pi <0 tức là O nằm phía trên đườ ng thẳng ⇒ ta chọn S

38



• Nếu pi >0 tức là O nằm phía dướ i đườ ng thẳng ⇒ ta chọn PLàm sao để tính pi ? tươ ng tự như thuật toán Bresenham, ta cũng dùng phươ ng pháp “lũytiến”, dùng giá tr ị ở bướ c tr ướ c pi để tính giá tr ị ở bướ c tiế p theo pi+1

Ta có: pi+1 – pi =2F(xi+1 +1,yi+1 +1/2) - 2F(xi +1,yi +1/2)= 2[A(xi+1+1)+B(yi+1+1/2)+C] - 2[A(xi+1)+B(yi+1/2)+C]= 2dy – 2dx(yi+1 – yi)

Như vậy• Nếu pi <0 thì ta chọn yi+1 = yi , do đó pi+1 = pi +2dy• Nếu pi >0 thì ta chọn yi+1 = yi+1 , do đó pi+1 = pi +2dy – 2dx

Cuối cùng, giá tr ị đầu p0 đượ c tính như sau: nhận xét r ằng điểm đầu (x0, y0) thuộc đoạnthẳng thực tức là Ax0 + By0 +C = 0

p0 = 2F(x0+1,y0+1/2) = 2[A(x0+1)+B(y0+1/2)+C]= 2(Ax0 + By0 +C) + 2A +B = 2A+B= 2dy –dx

II Vẽ đườ ng tròn

Thuật toán MidPoint

B

(-x, y)

(-y, x)

(-y, -x)

(-x, -y) (x, -y)

(y, -x)

(y,x)

(x,y)

A

Đầu tiên ta nhận xét r ằng, do tính đối xứng của đườ ng tròn nên ta chỉ cần vẽ đượ ccung AB là cung 1/8 đườ ng tròn, sau đó lấy đối xứng qua các tr ục và các đườ ng phân giácta sẽ có cả đườ ng tròn. Chẳng hạn như ở hình vẽ trên nếu xác định đượ c điểm (x,y), lấy đốixứng qua đườ ng phân giác của góc phần tư thứ nhất ta thu đượ c điểm (y,x), lấy đối xứngqua tr ục hoành ta thu đượ c 2 điểm (y,-x) và (x,-y) ... Nếu ta chia thành 16,32 ... phần thìviệc xác định tọa độ 15,31... điểm đối xứng còn lại sẽ r ất khó. Còn nếu chia thành 4 hay 2

phần thì số điểm lân cận cần phải loại tr ừ có thể nhiều hơ n 2 điểm.

39



P

S

M: điểm giữa

Q(xi+1,y)

xi xi+1

yi

yi-1

Gọi R là bán kính đườ ng tròn, ta xuất phát từ điểm A (0,R) để vẽ cung AB. Nhìn hình vẽ tathấy, nếu (xi, yi) là điểm ảnh đã vẽ đượ c ở bướ c thứ i thì điểm ảnh (xi+1, yi+1) ở bướ c tiế ptheo chỉ có thể là S hoặc P, tức là

• xi+1 = xi + 1• yi+1 ∈ {yi, yi-1}

Giống như thuật toán vẽ đoạn thẳng, ý tưở ng chính để lựa chọn giữa S và P ở đây là căn cứ vào vị trí tươ ng đối của điểm giữa M của SP vớ i đườ ng tròn. Nếu M nằm bên trong đườ ngtròn như hình vẽ thì ta sẽ chọn S vì nó gần điểm thực Q hơ n so vớ i P. Ngượ c lại nếu M nằmngoài đườ ng tròn thì P sẽ đượ c chọn.

Đặt F(x,y) = x2 + y2 – R 2 , các định lý toán học cho ta biết r ằng•

F(x,y) <0 nếu điểm (x,y) nằm trong đườ ng tròn• F(x,y) =0 nếu điểm (x,y) nằm trên đườ ng tròn• F(x,y) >0 nếu điểm (x,y) nằm ngoài đườ ng tròn

Đặt pi = F(M) = F(xi+1,yi – ½) ta có• Nếu pi<0 tức là M nằm trong đườ ng tròn, ta sẽ chọn S, tức là yi+1 = yi • Nếu pi≥0 ta sẽ chọn P, tức là yi+1 = yi -1

Cách tính giá tr ị của pi cũng tươ ng tự như ở thuật toán vẽ đoạn thẳng. Ta có:

pi+1 – pi = F[xi+1+1,yi+1 – ½] - F[(xi+1,yi – ½)]

= [(xi+1+1)2

+(yi+1 – ½)2

- R 2

] - [(xi+1)2

+(yi – ½)2

- R 2

]= 2xi +3+(yi+1

2 – yi2) – (yi+1 - yi)

Do đó• Nếu pi <0 ta chọn yi+1 = yi ⇒ pi+1 = pi + 2xi +3• Nếu pi ≥0 ta chọn yi+1 = yi-1 ⇒ pi+1 = pi + 2xi -2yi +5

Cuối cùng ta tính giá tr ị đầu p0 ứng vớ i điểm A(0,R) p0=F(x0+1,y0-1/2) = F(0,R-1/2) = 5/4 -R

40



Thuật toán MidPoint vẽ đường tròn

Uses crt,graph;Var

gd,gm,x,y,R,p,mau:integer;

Procedure PutPixel8(x,y,c:integer);Begin putPixel(x,y,c); putPixel(y,x,c); putPixel(y,-x,c); putPixel(x,-y,c); putPixel(-x,-y,c); putPixel(-y,-x,c); putPixel(-y,x,c); putPixel(-x,y,c);End;

Begingd:=detect; initgraph(gd,gm,'');

SetViewPort(GetMaxX div 2, GetMaxY div 2, GetMaxX,GetMaxY,false);Randomize;R :=100 + random(200);

Lư u đồ thuật toán

MidPoint vẽ

đườ ng tròn

x < y ?

p:=5/4 -R;x:=0; y:=R ;PutPixel8 x

Yes

NoEnd

Nop < 0 ?

Yes

p:=p+2x+3; p:=p+2(x-y); y:=y-1;

x:=x+1;PutPixel(x,y);

Begin

41



mau:=random(GetMaxColor); {V ẽ đườ ng tròn MidPoint màu ng ẫ u nhiên }

x:=0; y:=R;PutPixel8(x,y,mau);

p:=1-R;while (x<y) do beginif p<0 then p:=p+2*x+3else

begin p:=p+2*(x-y)+5;y:=y-1;

end;x:=x+1;PutPixel8(x,y,mau);

end;readkey;

End.

Tại sao phải so sánh pi vớ i 0 trong các thuật toán trên ? bản chất việc so sánh này là gì ?

Trong thuật toán MidPoint, tại sao phải nhân F() vớ i 2 khi gán cho pi trong công thức pi = 2. F()

Hãy so sánh thuật toán vẽ đoạn thẳng DDA vớ i 2 thuật toán còn lai về mặt tốc độ thựchiện ? (Gợ i ý: 2 thuật toán kia cải thiện đáng k ể số phép tính cần thực hiện, vì sao? )

Vì sao nói thuật toán vẽ đoạn thẳng MidPoint chẳng qua là 1 cách diễn giải khác củathuật toán Bresenham ?

Trong thuật toán vẽ đườ ng tròn MidPoint, vì sao không chia đườ ng tròn thành nhiều hơ nhoặc ít hơ n 8 phần ?

Trong chươ ng trình minh họa thuật toán vẽ đườ ng tròn MidPoint, tại sao không để như lý thuyết là: p0 := 5/4 –R mà sửa thành p0:= 1- R ?

III Cắt xén (Clipping)

1. Thuật toán Cohen-Sutherland

Bài toán: giả thiết r ằng cửa sổ hiển thị là một hình chữ nhật vớ i các cạnh song song vớ i cáctr ục tọa độ như hình vẽ. Cho một đoạn thẳng bất k ỳ, hãy xác định phần nào của nó nằmtrong cửa sổ (tức là đượ c hiển thị), phần nào nằm ngoài (bị che khuất).

42



FJ

0110

0010

10101001

0001

0101 0100

0000

1000

L

ED

C

B

I

J’I’

AK

K’

ymax

ymin

xmin xmax

Cách làm: đầu tiên ta nhận xét r ằng một điểm P(x,y) nằm trong cửa sổ (đượ c nhìn thấy) khivà chỉ khi thỏa mãn đồng thờ i 2 điều kiện

xmax ≥ x ≥ xmin ymax≥ y ≥ ymin

Ngượ c lại, nếu một trong 2 điều kiện bị vi phạm thì P nằm ngoài cửa sổ và sẽ không đượ chiển thị.Các đoạn thẳng chỉ có thể thuộc một trong những tr ườ ng hợ p sau:• Hoàn toàn nằm trong cửa sổ, ví dụ như AB, khi đó cả 2 đầu mút đều nằm bên trong

cửa sổ • Hoàn toàn nằm ngoài cửa sổ (bị che toàn phần), ví dụ như CD, EF• Chỉ một phần nằm trong cửa sổ và đượ c hiển thị, ví dụ như KL và IJ

Đầu tiên, thuật toán Cohen – Sutherland dùng 4 đườ ng thẳng chứa cạnh cửa sổ chia mặt phẳng thành 9 phần. Mỗi điểm A(x,y) thuộc mặt phẳng sẽ đượ c gán mã 4 bit abcdtheo cách sau:

• a=1 ⇔ y > ymax : A nằm phía trên cửa sổ • b=1 ⇔ y < ymin : A nằm phía dướ i cửa sổ • c=1 ⇔ x > xmax : A nằm phía phải cửa sổ

• d=1 ⇔ x < xmin : A nằm phía trái cửa sổ Khi đó, ta nhận xét r ằng:• đoạn thẳng sẽ hoàn toàn nằm trong cửa sổ nếu cả 2 đầu mút đều bằng 0000• đoạn thẳng sẽ hoàn toàn nằm ngoài cửa sổ nếu k ết quả phép AND của 2 đầu mút

khác 0000Thực vậy, nhận xét đầu là hiển nhiên. Để minh họa cho nhận xét 2, xét đoạn thẳng EF:

E = 1010, F = 0010 ⇒ (E) AND (F) = (1010) and (0010) = 0010 ≠ 0 bit thứ 3 của cả 2 đầu mút E và F đều bằng 1, chứng tỏ chúng đều nằm bên phải cửa sổ, dođó cả đoạn thẳng d ĩ nhiên cũng nằm bên phải cửa sổ và sẽ không đượ c hiển thị.

Vấn đề còn lại là, nếu k ết quả phép AND hai đầu mút bằng 0000, khi đó thuật toán sẽ tìm giao của đoạn thẳng vớ i các biên của cửa sổ và xét từng phần của nó. Ta ký hiệu 4đườ ng thẳng chứa cạnh cửa sổ là:

43



• đườ ng 1: y = ymax • đườ ng 2: y = ymin • đườ ng 3: x = xmax • đườ ng 4: x = xmin

Khi đó nhìn vào mã của 2 đầu mút ta sẽ biết ngay đoạn thẳng đó cắt cạnh nào của cửa sổ. Ví

dụ:

0010

0001

4 3

JK’

L

K J’ I’

I0100

2

1

ymax

ymin

xmin xmax

Xét đoạn IJ

• Mã của I = 0100, bít thứ 2 =1 nên chắc chắn nó sẽ cắt đườ ng 2• Mã của J = 0001, bít thứ 4 =1 nên chắc chắn nó sẽ cắt đườ ng 4

Xét đoạn KL• Mã của L = 0100, bít thứ 3 =1 nên chắc chắn nó sẽ cắt đườ ng 3

Việc xác định tọa độ giao điểm là r ất đơ n giản vì ta đã biết rõ 2 đầu mút. Sau khi chia đoạnthẳng thành các đoạn, ta lặ p lại thuật toán vớ i mỗi đoạn chia cho đến khi k ết thúc. Ví dụ taxét đoạn IJ• Bướ c 1: k ết quả phép and bằng 0 nhưng 2 đầu mút khác 0: tìm giao điểm vớ i biên I’• Bướ c 2: loại đoạn II’

• Bướ c 3: xét đoạn JI’ : tìm giao điểm J’• Bướ c 4: loại đoạn JJ’. K ết thúc vớ i đoạn I’J’ đượ c hiển thị

2. Thuật toán Sutherland - Hodgman

Bài toán: ta cần cắt 1 đa giác bất k ỳ Y vào trong cửa sổ là một đa giác lồi X.

Cách làm: Ta sẽ duyệt lần lượ t các cạnh của X, vớ i mỗi cạnh đó ta lại xét lần lượ t cạnh củaY. K ết quả sau khi xén vớ i cạnh thứ i (của cửa sổ X) sẽ đượ c dùng để xén vớ i cạnh tiế p theoi+1 của X. Quy tắc là:

44



• nếu cạnh đang xét của Y đi từ trong cửa sổ ra ngoài (Pi-1 ở trong, Pi ở ngoài) thì chỉ giữ lại giao điểm I của Pi-1 Pi vớ i cạnh đang xét của X.

• nếu cạnh đang xét đi từ ngoài vào trong (tức là Pi-1 ở ngoài, Pi ở trong): giữ lại giaođiểm I và Pi

• tr ườ ng hợ p cạnh ở ngoài hoàn toàn: loại bỏ •

tr ườ ng hợ p cạnh ở trong hoàn toàn: giữ lại Pi .

Ví dụ Đầu tiên ta xét cạnh UV của cửa sổ cắt là tam giác UVT.

C ạnh đ ang xét (theo chiề u vecto) H ướ ng đ i Quyế t định giữ l ại

AB (xét vớ i UV) Từ ngoài vào trong P,BBC (xét vớ i VT) Trong ra ngoài QCD Ngoài vào trong R,DDE Hoàn toàn nằm trong EEK (xét vớ i TU) Trong ra ngoài MKF Hoàn toàn nằm ngoài Loại hết

FG Ngoài vào trong I,GGH (xét vớ i UV) Trong ra ngoài JHA Hoàn toàn nằm ngoài Loại hết

Ta thu đượ c đa giác (theo thứ tự): P,B,Q,R,D,E,M,I,G,J như hình vẽ Đoạn mã giả (pseudocode) sau minh họa cho thuật toán trên.

t:=1for i:=1 to n do {Đa giác cửa sổ X có n cạnh}for j:=1 to m do {Đa giác bị cắt Y có m cạnh }

k:=j+1; {Xét cạnh X jX j+1 của đa giác cửa sổ X}if k>n then k:=1 ;if (X j ở trong) then

VC

R

D

A

B

PQ

H

K F

GJ

EI

U TM

45



beginif (Xk ở trong) then Yt := Yk else Yt := giao điểm của X jXk vớ i cạnh i của Xt:=t+1;

end else

if (Xk ở trong ) then begin

Yt := giao điểm;t:=t+1;Yt := Xk ;t:=t+1;

end;

Vấn đề: cho tọa độ 1 điểm, làm sao biết điểm đó ở trong/ngoài đa giác lồi X ?

Bổ đề: nếu điểm đó nằm bên phải 1 cạnh nào đó của đa giác lồi X theo chiều dươ ng thì nónằm ngoài X. Nếu nó nằm bên trái tất cả các cạnh thì nó nằm bên trong X

B(x2,y2)

chiều dươ ng

bên trái

bên phải

P(x,y)

A(x1,y1)

Bổ đề: cho vector AB và điểm P(x,y), P nằm bên trái vector AB (như hình vẽ) nếu và chỉ

nếu (x2 – x1)(y – y1) – (y2 – y1)(x – x1) >0Ta công nhận, không chứng minh bổ đề toán này.

Vấn đề: cho tọa độ tậ p đỉnh của đa giác lồi X dướ i dạng 1 danh sách có thứ tự (ngh ĩ a là nếu biết 1 đỉnh thì ta luôn biết 2 đỉnh k ề của nó), làm sao xế p chúng lại “theo chiều dươ ng” ?

Cách làm: Chọn đỉnh có hoành độ nhỏ nhất, ký hiệu là A như hình vẽ. Gọi 2 đỉnh k ề nó làB,C trong đó xB < xC. Thứ tự theo chiều dươ ng sẽ là BAC. Sau đó ta chỉ việc đi tớ i đỉnh tiế ptheo C ...Thật vậy, ta có thể thấy rõ khi nhìn hình vẽ. Chỉ có 3 tr ườ ng hợ p:

• B,C nằm ở 2 phía của đườ ng thẳng x = xA • B,C cùng nằm bên phải đườ ng thẳng đó• B,C cùng nằm bên trái

46



CB

A

CB

C

A

B

A

2. Clipping một đoạn thẳng vào đườ ng tròn

BO

A

d

B

OA

d

D

C

(b)(a) (c)

A

B

Gọi d là khoảng cách từ tâm O tớ i đoạn thẳng AB.• Nếu d > bán kính r ⇒ clip(AB) = ∅ • Nếu d = bán kính r ⇒ clip(AB) = {điểm tiế p xúc}• Nếu d < bán kính r, ta chia thành 3 tr ườ ng hợ p

o Cả A,B đều nằm trong đườ ng tròn: clip(AB) = ABo Một trong hai điểm (giả sử là A) nằm ngoài đườ ng tròn. Gọi C là giao của AB

vớ i đườ ng tròn ta có clip(AB) = BCo Cả 2 cùng nằm ngoài đườ ng tròn, xét dấu:

Nếu (xA-xC) (xB-xC) <0 thì clip(AB)=CD (tr ườ ng hợ p (c)) Nếu (xA-xC) (xB-xC) >0 thì clip(AB)=∅ (tr ườ ng hợ p (b))

IV. Tô màu vùng khép kín

Cho một vùng khép kín đượ c giớ i hạn bở i một đườ ng biên đồng màu. Vấn đề đặt ra là tômàu cho miền trong của vùng đó. Có 2 phươ ng pháp chính: tô theo dòng quét (scan line fill)và tô dựa theo đườ ng biên (boundary fill).

1. Thuật toán tô màu theo đườ ng biên (Boundary algorithm)

Cách tô này yêu cầu phải biết tr ướ c tọa độ một điểm (điểm “gieo”) nằm bên trongvùng cần tô. Bắt đầu từ điểm đó ta sẽ tô “loang” dần ra các vùng xung quanh bằng việc đọcmàu của các điểm lân cận để kiểm tra xem chúng đã đượ c tô màu hay chưa. Nếu đã đượ c tô,

47



hoặc màu của điểm lân cận là màu của biên thì dừng lại và xét điểm khác, nếu không thì tôđiểm lân cận đó.

Có vài phươ ng pháp khác nhau để xác định lân cận như: loại 4 điểm, loại 8 điểm

Lân cận 4 điểm Lân cận 8 điểm

Procedure BFill ( x,y,c,B:integer){(x,y) đ iể m đ ang xét, c: màu tô, B: màu đườ ng biên }

Var t: integer;Begin

t:=GetPixel(x,y);if (t <>B) and (t<>c) then{

putpixel(x,y,c);BFill(x-1,y,c,B);BFill(x+1,y,c,B);BFill(x,y-1,c,B);

BFill(x,y+1,c,B);}Cách làm như trên có nhượ c điểm là khi gọi đệ quy cho 4 điểm lân cận không xét tớ i việcchúng đã đượ c kiểm tra ở các bướ c tr ướ c hay chưa. Cần có cải tiến để không xét lại nhữngđiểm đã đượ c kiểm tra r ồi.

2. Thuật toán tô màu dự a theo dòng quét (Scan-line algorithm)

Giả sử dùng cần tô là một đa giác N đỉnh {Pi =(xi,yi)} i=1..NTa sử dụng 1 dòng quét song song vớ i tr ục Ox đi từ đỉnh trên cùng (Ymax) đến đỉnh

dướ i cùng (Ymin) của vùng cần tô. Vớ i mỗi giá tr ị y = yi, dòng quét cắt các đườ ng biên củavùng cần tô tạo thành các đoạn thẳng. Ta tô màu các điểm nằm giữa hai đầu mút của cácđoạn thẳng đó.

48



Ymin

Ymax

Các bướ c:- Xác định Ymax, Ymin của đa giác cần tô- Vớ i mỗi dòng quét y = yi (Ymin ≤ yi ≤ Ymax), xác định hoành độ giao điểm vớ i các

cạnh của đa giác- Sắ p xế p chúng theo thứ tự tăng dần thành các cặ p (x0, x1) ...- Tô các đoạn (x0, x1), (x2, x3), (x4, x5) ...

Tuy nhiên, có một ngoại lệ là khi dòng quét đi qua đỉnh P của đa giác. Khi đó ta phải chiathành 2 tr ườ ng hợ p:

- Nếu 2 cạnh k ề của P có hướ ng ngượ c nhau, một cạnh đi lên một cạnh đi xuống thì

trong danh sách giao điểm ta sẽ tính là 2 giao điểm có tọa độ trùng nhau ở đỉnh P. Ngh ĩ a là xi = xi+1 = xP - Nếu 2 cạnh k ề của P cùng hướ ng nhau, cả hai cùng đi lên hoặc đi xuống thì P chỉ

đượ c tính là 1 giao điểm.

2 31

4

2,3

1

Chuong 12_NoRestriction

Documents

Transcript of Chuong 12_NoRestriction