Bài giảng kỹ thuật Đồ họa và thực tại Ảo it32 Đại học mở hà nội

Bài 1 – TỔNG QUAN KỸ THUẬT ĐỒ HỌA VÀ THỰC TẠI ẢO Mục tiêu-yêu cầu- kết quả Mục tiêu: Bài học nhằm cung cấp các kiến thức về Kỹ thuật đồ họa và thực tại ảo, các khái niệm cơ bản của hệ đồ họa Yêu cầu: Sinh viên nắm vững các kiến thức cơ bản liên quan như kỹ thuật đồ họa điểm, kỹ thuật đồ họa vector, mô hình màu Kết quả đạt được: Sinh viên hiểu thế nào là một hệ đồ họa máy tính, các loại mô hình màu, các thiết bị phần cứng, phần mềm hệ đồ họa, các ứng dụng của đồ họa máy tính hiện nay. 1. Sơ lược lịch sử • 1960 William Fetter (Thuật ngữ kỹ thuật đồ hoạ máy tính (Computer Graphics) • 1960 - SAGE (Semi-Automatic Ground Environment System) Bút sáng • 1960-1963 Dự án Sketchpad tại MIT • 1963 Ivan shutherland (hội nghị Fall Joint Computer - lần đầu tiên khả năng tạo mới, hiển thị và thay đổi được thực hiện trong thời gian thực trên màn CRT) • Wireframe graphics • Display Processors • Luận văn tiến sỹ của Ivan Sutherland tại MIT

Bài 1 – TỔNG QUAN KỸ THUẬT ĐỒ HỌA VÀ THỰC TẠI ẢO

Mục tiêu-yêu cầu- kết quả

Mục tiêu: Bài học nhằm cung cấp các kiến thức về Kỹ thuật đồ họa và thực tại ảo, các khái niệm cơ bản của hệ đồ họa

Yêu cầu: Sinh viên nắm vững các kiến thức cơ bản liên quan như kỹ thuật đồ họa điểm, kỹ thuật đồ họa vector, mô hình màu

Kết quả đạt được: Sinh viên hiểu thế nào là một hệ đồ họa máy tính, các loại mô hình màu, các thiết bị phần cứng, phần mềm hệ đồ họa, các ứng dụng của đồ họa máy tính hiện nay

1 Sơ lược lịch sử

• 1960 William Fetter (Thuật ngữ kỹ thuật đồ hoạ máy tính (Computer Graphics)

• 1960 - SAGE (Semi-Automatic Ground Environment System) Bút sáng

• 1960-1963 Dự án Sketchpad tại MIT

• 1963 Ivan shutherland (hội nghị Fall Joint Computer - lần đầu tiên khả năng tạo mới, hiển thị và thay đổi được thực hiện trong thời gian thực trên màn CRT)

• Wireframe graphics

• Display Processors

• Luận văn tiến sỹ của Ivan Sutherland tại MIT

– Vấn đề tương tác người máy

– Loop

Hiển thị

Người dùng sử dụng bút ánh sáng

Máy tính hiển thị hình ảnh mới

– Sutherland tạo ra rất nhiều thuật toán cho CG

• 1966 Ralph Baer tạo các sản phẩm thương mại hướng người sử dụng đầu tiên – Odyssey Pinball

• 1967 GE đưa ra hệ thống mô phỏng bay trên màn hình hiển thị màu đầu tiên cho NASA

• Raster Graphics

• Bắt đầu cung cấp các tiêu chuẩn đồ họa – IFIPS

• GKS: European – 2D, trở thành tiêu chuẩn ISO

• Core: North American – 3D, tuy nhiên không được trở thành tiêu chuẩn ISO

• Michael Crichton’s “West World” với đồ họa 2D (1973)

• Lần đầu tiên máy tính được sử dụng để mô phỏng hình ảnh

• 1974 Intel phát triển bộ xử lý 8080

• 1975 Bill Gates sáng lập Microsoft

• 1976 Steve Jobs và Steve Wozniak sáng lập Apple

• 1977 Viện Hàn Lâm Điện Ảnh và Khoa Học đưa ra hạng mục Hiệu ứng Hình ảnh cho Oscar

• 1977 Star Wars dành giải Oscar về Hiệu ứng hình ảnh

•1978 Superman

• 1979 Alien

• 1980 The Empire Strikes Back

• 1980-1990:

– Các thiết bị phần cứng dành riêng cho đồ họa

Silicon Graphics geometry engine

o VLSI xây dựng graphics pipeline

– Các tiêu chuẩn công nghiệp

PHIGS

RenderMan

– Networked graphics: X Window System

– Tương tác Người - Máy (HCI)

• 1990-2000

– OpenGL API

– Tạo ra bộ phim hoạt hình hoàn chỉnh đầu tiên (Toy Story)

– Khả năng mới của phần cứng

– Card đồ họa cho máy tính chiếm lĩnh thị trường – Nvidia, ATI, 3DLabs

– CGraphics trở thành công cụ cho công nghiệp sản xuất phim: Maya, Lightwave

2 Khái niệm về đồ họa máy tính

Đồ họa máy tính là những gì liên quan đến việc tạo, lưu trữ, xử lý và hiển thị hình ảnh hay mô hình trên máy vi tính

Thuật ngữ Computer Graphics được William Fetter đặt ra vào năm 1960 nhằm mô tả cách thiết kế mới khi làm việc trong hãng Boeing Đồ họa máy tính được ứng dụng để thiết kế buồng lái của phi công

Đồ họa máy tính là hướng phát triển rất nhanh chóng vì có rất nhiều ứng dụng:

Cơ bản nhất như hiển thị phục vụ cho việc tương tác giữa người với máy tính khi làm việc

Thiết kế kỹ thuật, mỹ thuật

Mô phỏng cơ học, mạch điện tử

Trực quan hóa thông tin khoa học

Gaming, Virtual Reality,…

Phân tích thông tin đầu vào cho các thiết bị thông minh như robot, thiết bị nhận dạng,…

3 Các kỹ thuật đồ họa

3.1 Kỹ thuật đồ họa điểm

Nguyên lý: các mô hình, hình ảnh đối tượng được hiển thị như một lưới điểm (grid) các pixel rời rạc, các pixel có vị trí xác định, hiển thị với một giá trị rời rạc (số nguyên) như thông số màu sắc hay độ sáng Tập hợp các pixel tạo nên mô hình, hình ảnh

Phương pháp tạo:

PP1: dùng phần mềm vẽ trực tiếp từng pixel dựa trên các lý thuyết mô phỏng

(Fractal) để xây dựng nên đối tượng

PP2: rời rạc hóa hình ảnh thực của đối tượng, sau đó có thể sửa đổi hoặc xử lý mảng các pixel thu được dựa theo các phương pháp khác nhau để thu được hình ảnh đặc trưng của đối tượng

3.2 Kỹ thuật đồ họa vector

Nguyên lý: xây dựng mô hình hình học cho đối tượng, xác định thuộc tính sau đó thực hiện tô trát (rendering) để hiển thị từng điểm hình ảnh thực của đối tượng Kỹ thuật này chỉ lưu trữ mô tả toán học của các thành phần trong mô hình hình học cùng các thuộc tính mà không lưu toàn bộ các pixel hình ảnh tô trát

Sự khác biệt giữa Đồ họa điểm và Đồ họa vector:

Đồ họa điểm có thể copy được các pixel qua lại giữa các hình ảnh

Đồ họa vector không thay đổi thuộc tính từng điểm mà có thể xử lý với từng thành phần hình học cơ sở của nó

Có thể quan sát hình ảnh ở nhiều góc độ khác nhau bằng cách thay đổi điểm và góc nhìn

4 Phân loại của đồ họa máy tính

Phân loại theo các lĩnh vực của đồ hoạ máy tính

Phân loại theo hệ toạ độ

- Kỹ thuật đồ hoạ hai chiều: là kỹ thuật đồ hoạ máy tính sử dụng hệ toạ độ hai chiều (hệ toạ độ phẳng), sử dụng rất nhiều trong kỹ thuật xử lý bản đồ, đồ thị

- Kỹ thuật đồ hoạ ba chiều: là kỹ thuật đồ hoạ máy tính sử dụng hệ toạ độ ba chiều, đòi hỏi rất nhiều tính toán và phức tạp hơn nhiều so với kỹ thuật đồ hoạ hai chiều

Các lĩnh vực của đồ hoạ máy tính:

- Các hệ CAD/CAM (Computer Aided Design/Computer Aided Manufacture System): kỹ thuật đồ hoạ tập hợp các công cụ, các kỹ thuật trợ giúp cho thiết kế các chi tiết và các hệ thống khác nhau: hệ thống cơ, hệ thống điện, hệ thống điện tử…

- Đồ hoạ minh hoạ (Presentation Graphics): gồm các công cụ giúp hiển thị các số liệu thí nghiệm một cách trực quan, dựa trên các mẫu đồ thị hoặc các thuật toán có sẵn

- Đồ hoạ hoạt hình và nghệ thuật: bao gồm các công cụ giúp cho các hoạ sĩ, các nhà thiết kế phim hoạt hình chuyên nghiệp làm các kỹ xảo hoạt hình, vẽ tranh Ví dụ: phần mềm 3D Studio, 3D Animation, 3D Studio Max

- Kỹ thuật xử lý ảnh (Computer Imaging): sau quá trình xử lý ảnh cho ta ảnh số của đối tượng Trong quá trình xử lý ảnh sử dụng rất nhiều các kỹ thuật phức tạp: kỹ thuật khôi phục ảnh, kỹ thuật làm nổi ảnh, kỹ thuật xác định biên ảnh

- Kỹ thuật nhận dạng (Pattern Recognition): từ những ảnh mẫu có sẵn ta phân loại theo cấu trúc, hoặc theo các tiêu trí được xác định từ trước và bằng các thuật toán chọn lọc để có thể phân tích hay tổng hợp ảnh đã cho thành một tập hợp các ảnh gốc, các ảnh gốc này được lưu trong một thư viện và căn cứ vào thư viện này ta xây dựng được các thuật giải phân tích và tổ hợp ảnh

- Kỹ thuật tổng hợp ảnh (Image Synthesis): là lĩnh vực xây dựng mô hình và hình ảnh của các vật thể dựa trên các đối tượng và mối quan hệ giữa chúng

5 Một số ứng dụng của đồ hoạ máy tính

Đồ hoạ máy tính là một trong những lĩnh vực lý thú nhất và phát triển nhanh nhất của tin học Ngay từ khi xuất hiện nó đã có sức lôi cuốn mãnh liệt, cuốn hút rất nhiều người ở nhiều lĩnh vực khác nhau như khoa học, nghệ thuật, kinh doanh, quản lý Tính hấp dẫn của nó có thể được minh hoạ rất trực quan thông qua các ứng dụng của nó

- Xây dựng giao diện người dùng (User Interface)

Giao diện đồ hoạ thực sự là cuộc cách mạng mang lại sự thuận tiện và thoải mái cho người dùng ứng dụng Giao diện WYSIWYG và WIMP đang được đa số người dùng ưu thích nhờ tính thân thiện, dễ sử dụng của nó

- Tạo các biểu đồ trong thương mại, khoa học, kỹ thuật

Các ứng dụng này thường được dùng để tóm lược các dữ liệu về tài chính, thống kê, kinh tế, khoa học, toán học giúp cho nghiên cứu, quản lý một cách có hiệu quả

- Tự động hoá văn phòng và chế bản điện tử

- Thiết kế với sự trợ giúp của máy tính (CAD_CAM) - Lĩnh vực giải trí, nghệ thuật

và mô phỏng

- Điều khiển các quá trình sản xuất (Process Control) - Lĩnh vực bản đồ

(Cartography)

- Giáo dục và đào tạo

6 Các chuẩn giao diện của hệ đồ hoạ

Mục tiêu căn bản của phần mềm đồ hoạ được chuẩn là tính tương thích Khi các công cụ được thiết kế với hàm đồ hoạ chuẩn, phần mềm có thể được di chuyển một cách

dễ dàng từ hệ phần cứng này sang hệ phần cứng khác và được dùng trong nhiều cài đặt và ứng dụng khác nhau

GKS (Graphics Kernel System): chuẩn xác định các hàm đồ hoạ chuẩn, được thiết

kế như một tập hợp các công cụ đồ hoạ hai chiều và ba chiều

GKS Functional Description, ANSI X3.124 - 1985.GKS - 3D Functional Description, ISO Doc #8805:1988

CGI (Computer Graphics Interface System): hệ chuẩn cho các phương pháp giao tiếp với các thiết bị ngoại vi

CGM (Computer Graphics Metafile): xác định các chuẩn cho việc lưu trữ và chuyển đổi hình ảnh

VRML (Virtual Reality Modeling Language) : ngôn ngữ thực tại ảo, một hướng

phát triển trong công nghệ hiển thị được đề xuất bởi hãng Silicon Graphics, sau đó đã được chuẩn hóa như một chuẩn công nghiệp

PHIGS (Programmers Hierarchical Interactive Graphics Standard): xác định các phương pháp chuẩn cho các mô hình thời gian thực và lập trình hướng đối tượng PHIGS Functional Description, ANSI X3.144 - 1985.+ Functional Description, 1988,

7 Phần cứng đồ họa (Graphics Hardware)

7.1 Các thành phần phần cứng của hệ đồ hoạ tương tác

CPU: thực hiện các chương trình ứng dụng

Bộ xử lý hiển thị (Display Processor): thực hiện công việc hiển thị dữ liệu đồ hoạ

Bộ nhớ hệ thống (System Memory): chứa các chương trình và dữ liệu đang thực hiện

Gói phần mềm đồ hoạ (Graphics Package): cung cấp các hàm đồ hoạ cho chương trình ứng

Thiết bị hiển thị: Màn hình, card đồ họa, máy chiếu, máy in,…

Thiết bị nhập: Bàn phím, chuột, máy quét ảnh, máy quét laser,…

Vi xử lý của đồ họa

GPU: thành phần xử lý chính trên bo mạch đồ họa với mục đich tăng tốc và phù hợp với các phần mềm đồ họa

• Modern GPUs có khả năng lập trình

– Lập trình trên pixel, vertex, video engines

– Hỗ trợ lập trình với các ngôn ngũ bậc cao

• Modern GPUs hỗ trợ độ chính xác cao

– Hỗ trợ 32 bit floating point trên pipeline

– Bộ nhớ

Nhược điểm

• GPUs được thiết kế chuyên cho video games

– Mô hình lập trình đặc biệt theo hướng computer graphics

– Môi trường lập trình chặt chẽ về cú pháp và câu lệnh

• Kiến trúc mức thấp:

– Thường song song

– Phát triển liên tục

– Công nghệ bí mật của các hãng

• Không đơn giản như viết code cho CPU

7.2 Thiết bị vào ra dữ liệu

Máy in

Sử dụng các công nghệ khác nhau như in kim, in phun, in laser

Dot size: đường kính của một điểm in bé nhất mà máy in có thể in được

Addressability: khả năng địa chỉ hoá các điểm in có thể có trên một đơn vị độ dài (dot per inch)

Số lượng màu có thể vẽ trên một điểm:

Dùng để chỉ và chọn các chức năng phù hợp yêu cầu

Máy quét ảnh, máy quét laser,…

7.3 Thiết bị hiển thị

Màn hình

CRT (Cathode Ray Tube)

Một chùm các tia điện tử (tia âm cực) phát ra từ một súng điện tử, vượt qua cuộn lái tia dẫn đến vị trí xác định trên màn hình được phủ một lớp phosphor Tại mỗi vị trí tương tác với tia điện tử hạt phosphor sẽ phát lên một chấm sáng nhỏ Nhưng chấm sáng sẽ mờ dần rất nhanh nên cần có cách nào nó duy trì ảnh trên màn hình Một trong các cách là: lặp đi lặp lại nhiều lần việc vẽ lại ảnh thật nhanh bằng cách hướng các tia điện tử trở lại ví trí cũ Gọi là làm tươi (refresh CRT)

Số lượng tối đa các điểm có thể hiển thị trên một CRT được gọi là độ phân giải (Resolution) Hay độ phân giải là số lượng các điểm trên một cm mà có thể được vẽ theo chiều ngang và chiều dọc (được xem như tổng số điểm theo mỗi hướng)

Kích thước vật lý của màn hình đồ hoạ được tính từ độ dài của đường chéo màn hình Thường dao động từ 12-27 inch, hoặc lớn hơn

Thuộc tính khác của màn hình là tỷ số phương (aspect ratio) Nó là tỷ lệ của các điểm dọc và các điểm ngang cần để phát sinh các đoạn thẳng có độ dài đơn vị theo cả hai hướng trên màn hình Màn hình có tỷ số phương khác một, thì hình vuông hiển thị trên đó thành hình chữ nhật còn hình tròn thành hình ellipse

Màn hình dạng điểm (Raster Display): thường gặp nhất trong số các dạng màn hình

sử dụng CRT trên công nghệ truyền hình Mỗi điểm trên màn hình được gọi là pixel Các thông tin về ảnh hiển thị trên màn hình được lưu trữ trong một vùng bộ nhớ gọi là vùng đệm làm tươi (Refresh buffer) hay là vùng đệm khung (Frame Buffer) Vùng lưu trữ tập các giá trị cường độ sáng của toàn bộ các điểm trên màn hình và luôn tồn tại một cách song ánh giữa mỗi điểm trên màn hình và mỗi phần tử trong vùng này

Để tạo ra hình ảnh đen trắng, đơn giản chỉ cần lưu thông tin của mỗi Pixel là một bít (0,1) Trong trường hợp ảnh nhiều màu thì cần nhiều bít hơn, nếu thông tin mỗi pixel được lưu bằng b bít thì ta có thể có 2b

giá trị mầu phân biệt cho pixel đó Trong các màn hình màu, người ta định nghĩa tập các màu làm việc trong một bảng tra (LookUp Table - LUT) Mỗi phần tử của LUT được định nghĩa một bộ ba giá trị (RGB) mô tả một màu nào

đó Khi cần sử dụng một màu, ta chỉ cần chỉ định số thứ tự (index) tương ứng của màu đó trong LUT, số phần tử trong bảng LUT chính là số màu có thể được hiển thị cùng một lúc trên màn hình

Ví dụ mô hình đồ họa điểm ngôi nhà và ngôi sao

Song ánh giữa vùng đệm khung và màn hình

X: 0¸ Xmax2 màu/ 1 bit

Y: 0¸ Ymax16 màu/ 4 bit; 256 màu/ 8bit

2 16 màu/ 16 bit ; 224 màu/ 24 bit

640 x 480 x 16 → Video RAM = 2MB

1024 x 1024 x 24 → Video RAM = 24MB

Việc làm tươi trên màn hình dạng này được thực hiện ở tốc độ 60 - 80 frame/giây Đôi khi tốc độ làm tươi còn được biểu diễn bằng đơn vị Hertz (Hz - số chu kỳ trên/giây), trong đó một chu kỳ tương ứng với một frame Vậy tốc độ làm tươi 60 frame/giây đơn giản là 60 Hz Khi đạt đến cuối mỗi dòng quét, tia điện tử quay trở lại bên trái của màn hình để bắt đầu dòng quét kế tiếp Việc quay trở về bên trái màn hình sau khi làm tươi mỗi dòng quét được gọi là tia hồi ngang (Horizontal retrace) Và tới cuối mỗi frame, tia điện tử (tia hồi dọc - Vertical retrace) quay trở lại góc bên trái của màn hình để chuẩn bị bắt đầu frame kế tiếp

LCD - Màn hình tinh thể lỏng (Liquid Crystal Display)

Dựa vào công nghệ truyền ánh sáng qua điện cực mà đặt giữa là cuộn dây xoắn Khi chưa có từ trường (chưa có dòng điện) ở cuộn dây thì ánh sáng truyền thẳng, khi có từ trường thì ánh sáng truyền đổi chiều

Phân loại: có 2 loại là Active và passive

Active:

Sử dụng ánh sáng nền được tạo ra bằng đèn (led hoặc neon)

Phần lớn năng lượng màn hình này tiêu thụ vào việc phát sáng

Môi trường sử dụng không cần có ánh sáng ngoài Thường được sử dụng trong các thiết bị hiển thị chất lượng cao như monitor máy tính, điện thoại di động, PDA,…

Công nghệ truyền ánh sáng trong màn hình tinh thể lỏng

Passive:

Không sử dụng ánh sáng nền

Rất tiết kiệm năng lượng

Tuy nhiên phải sử dụng trong môi trường có ánh sáng ngoài

Thường được sử dụng trong các thiết bị như máy tính bỏ túi, đồng hồ điện tử đeo tay

Thiết bị hiển thị đồ họa

Thiết bị đồ họa vector: tạo hình ảnh từ những đoạn thẳng

Ưu điểm: nhanh

Khuyết điểm: không tô màu cho vùng được

Các loại thiết bị vector thường gặp

Máy vẽ:

Máy vẽ flatbed Máy cắt decal Màn hình vector

Thiết bị raster: Tạo hình ảnh từ ma trận điểm

8 Phần mềm đồ họa (Graphics Software)

Ứng dụng: Photoshop, Corel, AutoCAD, Flash,…

Lập trình: DirectX, OpenGL, GDI, GTK, Graph.tpu…

Một số mô hình màu như: RGB, HSL, CMY,…

Chia làm 2 loại mô hình mầu là:

 Mầu thêm - additive: Mô hình mầu thêm sử dụng ánh sáng - light để hiển thị mầu Mầu sắc của mô hình này là kết quả của ánh sáng tryền dẫn - transmitted

 Mầu bù - subtractive: mô hình mầu bù sử dụng mực in - printing inks Mầu sắc cảm nhận được là từ ánh sáng phản xạ - reflected light

Mô hình HSL/HSV

Được biểu diễn bằng 3 giá trị: Hue (Tông màu), Saturation (Độ bảo hòa màu), Lightness (Độ sáng)

Hue: dùng để phân biệt sự khác nhau giữa các màu như xanh, đỏ, vàng

Saturation: chỉ ra mức độ thuần của một màu hay khoảng cách của màu tới điểm có cường độ cân bằng(màu xám)

Lightness: hiện thân về mô tả cường độ sáng từ ánh sáng phản xạ nhận được từ đối tượng

Mô hình CMY

Được dùng chủ yếu trong in ấn, là ba màu tương ứng với ba màu chính của mực in, gọi là những màu gốc để trừ vì những màu trong mô hình CMY được tạo ra thông qua việc hấp

thụ độ sáng Cyal hấp thu sự chiếu sáng của màu đỏ, Magenta hấp thu chiếu sáng của màu xanh lục, Yellow hấp thu chiếu sáng của xanh dương

Bài 2 – CÁC ĐỐI TƯỢNG ĐỒ HỌA CỞ SỞ Mục tiêu-yêu cầu- kết quả

Mục tiêu: Bài học nhằm cung cấp các khái niệm về hệ tọa độ, vẽ đường thẳng, đường tròn, hình ellippse

Yêu cầu: Sinh viên nắm vững các kiến thức liên quan đến toán học như dạng tổng quát phương trình đường thẳng, hệ số góc, tung độ dốc, phương trình đường tròn

Kết quả đạt được: Sinh viên có nắm được thế nào là một hệ tọa độ, thiết kế và cài đặt được các thủ tục vẽ các đường cơ bản như đường thẳng, đường tròn, ellípe

1 Các đối tượng đồ họa cơ sở

1.1 Hệ tọa độ

Một hệ mềm đồ họa được mô tả bao gồm 3 miền như sau :

- Miền điều khiển : bao bọc toàn bộ hệ thống

- Miền thực : nằm trong miền điều khiển Khi một số nào đó thâm nhập vào miền thực, nó sẽ được chuyển thành số thực dấu phẩy động, và khi có một số rời khỏi miền này thì nó sẽ được chuyển thành số nguyên có dấu 16 bits

- Miền hiển thị : nằm trong miền điều khiển nhưng phân biệt với miền thực Chỉ có

số nguyên 16 bits mới nằm trong miền hiển thị

Trong lĩnh vực kỹ thuật đồ họa, chúng ta phải hiểu được rằng thực chất của đồ họa

là làm thế nào để có thể mô tả và biến đổi được các đối tượng trong thế giới thực trên máy tính Bởi vì, các đối tượng trong thế giới thực được mô tả bằng tọa độ thực Trong khi đó, hệ tọa độ thiết bị lại sử dụng hệ tọa độ nguyên để hiển thị các hình ảnh Đây chính

là vấn đề cơ bản cần giải quyết Ngoài ra, còn có một khó khăn khác nữa là với các thiết

bị khác nhau thì có các định nghĩa khác nhau Do đó, cần có một phương pháp chuyển đổi tương ứng giữa các hệ tọa độ và đối tượng phải được định nghĩa bởi các thành phần đơn giản như thế nào để có thể mô tả gần đúng với hình ảnh thực bên ngoài

Hai mô hình cơ bản của ứng dụng đồ họa là dựa trên mẫu số hóa và dựa trên đặc trưng hình học Trong ứng dụng đồ họa dựa trên mẫu số hóa thì các đối tượng đồ họa được tạo ra bởi lưới các pixel rời rạc Các pixel này có thể đuợc tạo ra bằng các chương

trình vẽ, máy quét, Các pixel này mô tả tọa độ xác định vị trí và giá trị mẫu Thuận lợi của ứng dụng này là dể dàng thay đổi ảnh bằng cách thay đổi màu sắc hay vị trí của các pixel, hoặc di chuyển vùng ảnh từ nơi này sang nơi khác Tuy nhiên, điều bất lợi là không thể xem xét đối tượng từ các góc nhìn khác nhau Ứng dụng đồ họa dựa trên đặc trưng hình học bao gồm các đối tượng đồ họa cơ sở như đoạn thẳng, đa giác, Chúng được lưu trữ bằng các mô hình và các thuộc tính Ví dụ: đoạn thẳng được mô hình bằng hai điểm đầu và cuối, có thuộc tính như màu sắc, độ dày Người sử dụng không thao tác trực tiếp trên các pixel mà thao tác trên các thành phần hình học của đối tượng

Hệ toạ độ thế giới thực (WCS: World Coordinate System)

WCS hay hệ toạ độ thực là hệ toạ độ được dùng mô tả các đối tượng trong thế giới thực Một trong hệ toạ độ thực được dùng nhiều nhất là hệ toạ độ Descartes Bất kì điểm nào trong mặt phẳng được mô tả bằng cặp toạ độ (xp,yp) trong đó xp,yp € R Gốc toạ độ là điểm O có toạ độ (0,0), Ox,Oy lần lượt là trục hoành và trục tung và x,y là hoành độ và tung độ

Các toạ độ thế giới thực cho phép người sử dụng bất kì một thứ nguyên (dimension) qui ước: foot, cm, nm, km, inch tuỳ ý

Hệ toạ độ thiết bị (DCS: Device Coordinate System)

Hệ toạ độ thiết bị là hệ toạ độ được dùng bởi một thiết bị xuất cụ thể

nào đó như máy in, màn hình

Các điểm được biểu diễn bởi cặp toạ độ (x,y), nhưng x,y €N Điểm

trong toạ độ thực được định nghĩa liên tục, còn trong toạ độ thiết bị thì rời

rạc do tính chất của tập các số tự nhiên

Các toạ độ (x,y) có giới hạn trong một khoảng nào đó

Hệ tọa độ thiết bị chuẩn (Normalized device coordinates)

Do cách định nghĩa các hệ tọa độ thiết bị khác nhau nên một hình ảnh hiển thị được trên thiết bị này là chính xác thì chưa chắc hiển thị chính xác trên thíết bị khác Người ta xây dựng một hệ tọa độ thiết bị chuẩn đại diện chung cho tất cả các thiết bị

để có thể mô tả các hình ảnh mà không phụ thuộc vào bất kỳ thiết bị nào

Trong hệ tọa độ chuẩn, các tọa độ x, y sẽ được gán các giá trị trong đoạn từ [0,1] Như vậy, vùng không gian của hệ tọa độ chuẩn chính là hình vuông đơn vị có góc trái dưới (0, 0) và góc phải trên là (1, 1)

Quá trình mô tả các đối tượng thực như sau

1.2 Điểm

Là thành phần cơ sở được định nghĩa trong một hệ tọa độ, đối với hệ tọa độ 2 chiều mỗi điểm được xác định bởi hoành độ và tung độ Ngoài thông tin tọa độ, điểm còn có thông tin màu sắc

Ví dụ: Trong mặt phẳng điểm là một cặp (x,y)

Trong không gian ba chiều, điểm là bộ ba (x,y,z)

Trên màn hình máy tính, một điểm là một vị trí trong vùng nhớ màn hình dùng để lưu trữ các thông tin vầ độ sáng của điểm tương ứng trên màn hình

Số điểm trên màn hình gọi là độ phân giải cùa màn hình

(480*600,600*800,1024*1024 )

1.3 Đường thẳng, đường gấp khúc và đa giác

Đường thẳng xác định qua 2 điểm, đoạn thẳng bị giới hạn bởi 2 điểm đầu và cuối Điểm đầu (x1, y1) và điểm cuối (x2, y2)

Phương trình tham số:

Khi t thuộc [0,1] ta có các điểm x, y thuộc về đoạn thẳng giới hạn bởi (x1, y1) và (x2, y2)

Khi t thuộc [-∞ ,+∞] ta có toàn bộ đường thẳng

Đường gấp khúc: là tập các đoạn thẳng nối với nhau một cách tuần tự, các đoạn không nhất thiết phải tạo thành hình khép kín và có thể cắt nhau Giao của hai đoạn thẳng

là đỉnh, đỉnh đầu và đỉnh cuối của đa giác trùng nhau

Đoạn thẳng, đường thẳng có thuộc tính màu sắc, độ rộng, kiểu nét

Đa giác là đường gấp khúc có điểm đầu trùng điểm cuối

1.4 Vùng tô

Bao gồm đường biên và vùng bên trong, đường biên là đường khép kín như đa giác lồi

Vùng tô có thuộc tính của đường thẳng, và thuộc tính riêng là mầu tô và mẫu tô

1.5 Kí tự, chuỗi kí tự

Ký tự cho phép hiển thị thông tin theo ngôn ngữ nào đó

Ký tự có thuộc tính màu sắc, kiểu chữ, cỡ chữ, khoảng cách giữa các ký tự, hướng hiển thị ký tự

Theo định dạng bitmap: mỗi ký tự được biểu diễn bằng một ma trận với kích thước ngang dọc nhất định

Ký tự „B‟ được biểu điễn bằng ma trận 8x8 với các phần tử là các bit 0 hoặc 1 Các font bitmap có khuyết điểm là chất lượng thấp khi hiển thị ở kích thước lớn Việc xử lý và lưu trữ tương đối đơn giản

Theo dạng vector (Truetype font):

Thông tin về ký tự được biểu diễn dưới dạng các thành phần hình học như đoạn thẳng, cung tròn…

Ưu điểm của cách biểu diễn này là không giới hạn kích thước khi hiển thị

2 Các thuật toán vẽ đường 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 cho màn hình vẽ từng điểm ảnh (kiểu 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 Pixel trô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 cho trô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ất

Hơ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ất

Bà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 đó

y1

y2

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

2.1 Thuật toán DDA (Digital Differential Analyzer)

Là thuật toán tính toán các điểm vẽ dọc theo đường thẳng dựa vào hệ số góc của

1 2 y x

y

xxy

Nhận thấy tọa độ của điểm x sẽ tăng 1 đơn vị trên mỗi điểm vẽ, còn việc quyết định chọn

yi +1 là yi +1 hay yi sẽ phụ thuộc vào giá trị sau khi làm tròn của tung độ y Tuy nhiên, nếu tính trực tiếp giá trị thực của y ở mỗi bước từ phương trình y = mx+b thì cần một phép toán nhân và một phép toán cộng số thực: yi +1 = mxi +1 + b = m(xi + 1) + b = mxi + b + m

Để cải thiện tốc độ, người ta khử phép nhân trên số thực Ta có:

#define Round(a) int(a+0.5) int Color = GREEN;

void LineDDA (int x1, int y1, int x2, int y2)

{ int x = x1;

float y = y1;

float m = float(y2-y1)/(x2-x1);

putpixel(x, Round(y), Color);

for(int i=x1; i<x2; i++) {

x++;

y +=m;

putpixel(x, Round(y), Color);

} }

Ví dụ: Áp dụng thuật toán DDA vẽ đoạn thẳng từ điểm (2,2) đến điểm (8,4) m=2/6=0.33

2.2 Thuật toán Bresenham

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ước i 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)

P

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 + c

Thay 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

void LineBresenham(int x1, int y1, int x2, int y2, int color) {

int Dx = x2 – x1, Dy = y2 – y1; int x = x1, y = y1;

2.3 Thuật toán MidPoint

Jack Bresenham 1965 / Pitteway 1967, áp dụng cho việc sinh các đường thẳng và đường tròn 1985

MidPoint vẽ đoạn thẳng

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ọn

yi+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 = 0

vớ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ẳng

vì 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

 Nếu pi >0 tức là O nằm phía dưới đường thẳng  ta chọn P

Làm sao để tính pi ? tương tự như thuật toán Bresenham, ta cũng dùng phương pháp “lũy tiế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ạn thẳ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

3 Các thuật toán vẽ đường tròn

3.1 Thuật toán MidPoint

Đầ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ẽ được cung 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ác

ta 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

đối xứ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ứng qua 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

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ẽ

ta thấ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ếp theo 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 đường trò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ằm ngoài đường tròn thì P sẽ được chọn

Đặt F(x,y) = x2

+ y2 – R2 , 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 - R2] - [(xi+1)2 +(yi – ½)2 - R2]

= 2xi +3+(yi+12 – 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)

3.2 Thuật toán Bresenham

 Tương tự thuật toán vẽ đường thẳng Bresenham, các vị trí ứng với các tọa độ nguyên nằm trên đường tròn có thể

tính được bằng cách xác định một

trong hai pixel gần nhất với đường

tròn hơn trong mỗi bước

 Phương trình đường tròn: y2

= R2 –x2

 Giả sử vẽ được điểm (xi,yi)

 Vấn đề: Chọn điểm tiếp theo

Pi = (yi)2 -R2+ (xi + 1)2-R2+ (xi + 1)2+(yi - 1)2

P i = (y i ) 2 -2R 2 + 2(x i + 1) 2 +(y i - 1) 2

 Tính Pi+1 - Pi

Pi+1 = (yi+1)2 -2R2+ 2(xi+1 + 1)2+(yi+1 - 1)2

Pi+1 = 2(yi+1)2 -2R2+ 2(xi)2+8xi+8-2yi+1 + 1

P1 = R2 -2R2+ 2+ R2 -2R +1

P 1 = 3 -2R