TỔNG QUAN VỀ KỸ THUẬT ĐỒ HỌA MÁY TÍNH
Các khái niệm tổng quan về kỹ thuật đồ họa máy tính
Definition (ISO): Phương pháp và công nghệ chuyển đổi dữ liệu từ thiết bị đồ hoạ sang máy tính
Thuật ngữ đồ họa máy tính (computer graphics) do William Fetter đặt ra năm 1960 để mô tả một cách thiết kế mới khi đang làm việc tại hãng
Boeing Với cách này giúp tạo nhiều ảnh có thể sử dụng lại để có thể dễ dàng thiết kế buồng lái của phi công theo ý muốn
Computer Graphics là phương tiện đa năng và mạnh nhất của giao tiếp giữa con người và máy tính
Computer Graphics (Kỹ thuật đồ hoạ máy tính) thôn ng và tập hợp các công cụ
Mô hình lý thuyết và phần mềm có sự khác biệt trong việc kiến tạo, xây dựng, lưu trữ và xử lý các mô hình và hình ảnh của đối tượng Những mô hình và hình ảnh này thường là kết quả thu được từ nhiều lĩnh vực khoa học khác nhau như vật lý, toán học và thiên văn học.
Đồ họa máy tính (computer graphics) đề cập đến tất cả các hoạt động liên quan đến việc tạo ra hình ảnh bằng máy tính, bao gồm việc tạo, lưu trữ và thao tác trên các mô hình và hình ảnh.
Tổng quan về một hệ đồ họa
- Các thành phần phần cứng :
Thiết bị nhập : chuột, bàn phím,
Thiết bị hiển thị: màn hình, máy in,
- Các công cụ phần mềm:
Công cụ ứng dụng (application package) được thiết kế để người sử dụng có thể tạo ra hình ảnh mà không cần hiểu rõ về các thao tác bên trong Một số ví dụ nổi bật bao gồm AutoCAD, Adobe Photoshop và 3D Studio.
Công cụ lập trình là các gói phần mềm cung cấp một tập hợp các hàm đồ họa có thể sử dụng trong các ngôn ngữ lập trình cấp cao như C, Pascal Một số ví dụ điển hình về công cụ này bao gồm GRAPH.TPU, GRAPHICS.LIB và Open GL.
Ra đời nhằm đảm bảo tính tương thích, các phần mềm được thiết kế với các hàm đồ họa chuẩn có khả năng hoạt động trên nhiều hệ phần cứng và môi trường làm việc khác nhau.
GKS (Graphics Kernel System) là chuẩn đầu tiên trong phát triển phần mềm đồ họa, ban đầu chỉ dành cho công cụ đồ họa hai chiều, sau đó được mở rộng cho đồ họa ba chiều.
Các hàm GKS là những mô tả trừu tượng, không phụ thuộc vào ngôn ngữ lập trình cụ thể Để triển khai một chuẩn đồ họa cho ngôn ngữ lập trình, cần xác định và cụ thể hóa các cú pháp tương ứng.
- Các thành phần của công cụ lập trình:
Tập các công cụ tạo ra các đối tƣợng đồ họa cơ sở nhƣ điểm, đoạn thẳng, đuờng cong, vùng tô, kí tự,
Tập các công cụ thay đổi thuộc tính của các đối tƣợng cơ sở kể trên như màu sắc, kiểu đường, kiểu chữ, mầu tô,
Tập các công cụ thực hiện các phép biến đổi hình học dùng để thay đổi kích thước, vị trí, hướng,
Tập hợp các công cụ biến đổi hệ quan sát giúp xác định vị trí quan sát của các đối tượng và vị trí hiển thị của chúng trên thiết bị.
Các ứng dụng đồ họa hỗ trợ nhiều thiết bị nhập liệu khác nhau như chuột, bàn phím, bút vẽ và bảng vẽ, cho phép người dùng điều khiển và xử lý dòng dữ liệu nhập một cách linh hoạt và hiệu quả.
Tập các công cụ chứa các thao tác dùng cho quản lí và điều khiển nhƣ khởi tạo và đóng chế độ đồ họa, xóa toàn bộ màn hình,
Hình 1.2: Hình ảnh minh họa
Các kỹ thuật đồ họa
1.3.1 Kỹ thuật đồ họa điểm
Các mô hình, hình ảnh của các đối tƣợng đƣợc hiển thị thông qua từng pixel (từng mẫu rời rạc) Đặc điểm: có thể thay đổi thuộc tính
Xoá đi từng pixel của mô hình và hình ảnh các đối tƣợng
Các mô hình hình ảnh được hiển thị như một lưới điểm (grid) các pixel rời rạc
Từng pixel đều có vị trí xác định, đƣợc hiển thị với một giá trị rời rạc (số nguyên) các thông số hiển thị (màu sắc hoặc độ sáng)
Tập hợp tất cả các pixel của grid cho chúng ta mô hình, hình ảnh đối tƣợng mà chúng ta muốn hiển thị
Hình 1.3: Ảnh đồ họa điểm Phương pháp để tạo ra các pixel:
Phương pháp dùng phần mềm để vẽ trực tiếp từng pixel một
Dựa trên các lý thuyết mô phỏng (lý thuyết Fractal, v.v) để xây dựng nên hình ảnh mô phỏng sự vật
Phương pháp rời rạc hóa (số hóa) hình ảnh thực của đối tượng
Sửa đổi và xử lý hình ảnh là các phương pháp khác nhau để điều chỉnh mảng pixel, nhằm tạo ra hình ảnh đặc trưng của đối tượng.
1.3.2 Kỹ thuật đồ họa vector
Hình 1.4: Mô hình đồ họa vector
Mô hình hình học (geometrical model) cho mô hình hoặc hình ảnh của đối tƣợng
Xác định các thuộc tính của mô hình hình học này
Quá trình tô trát (rendering) để hiển thị từng điểm của mô hình, hình ảnh thực của đối tƣợng
Có thể định nghĩa đồ họa vector: Đồ họa vector = geometrical model + rendering
So sánh đồ họa điểm và đồ họa vector Đồ họa điểm(Raster Graphics)
Hình ảnh và mô hình của các vật thể đƣợc biểu diễn bởi tập hợp các điểm của lưới (grid)
Thay đổi thuộc tính của các pixel thay đổi từng phần và từng vùng của hình ảnh
Copy đƣợc các pixel từ một hình ảnh này sang hình ảnh khác Ðồ hoạ vector(Vector Graphics)
Không thay đổi thuộc tính của từng điểm trực tiếp
Xử lý từng phần hình học cơ sở và thực hiện quá trình tô trát, hiển thị lại hình ảnh và mô hình của sự vật Quan sát hình ảnh từ nhiều góc độ khác nhau thông qua việc thay đổi điểm nhìn và góc nhìn.
Ví dụ về hình ảnh đồ họa vector:
Hình 1.5: Ví dụ về đồ họa vector
1.3.3 Phân loại của đồ họa máy tính
Phân loại theo các lĩnh vực hoạt động của đồ họa máy tính:
Kỹ thuật nhận dạng Đồ họa hoạt hình và nghệ thuật
Kỹ thuật phân tích và tạo ảnh
CAD/CAM System Đồ họa minh họa
Phân loại theo hệ tọa độ:
Kỹ thuật đồ họa 2 chiều là một phương pháp đồ họa máy tính sử dụng hệ tọa độ hai chiều, thường được áp dụng trong việc xử lý bản đồ và đồ thị.
Kỹ thuật đồ họa 3 chiều là một lĩnh vực trong đồ họa máy tính, sử dụng hệ tọa độ ba chiều để tạo ra hình ảnh sống động Phương pháp này yêu cầu nhiều tính toán phức tạp hơn so với kỹ thuật đồ họa hai chiều, mang lại khả năng thể hiện chiều sâu và chi tiết phong phú hơn trong các sản phẩm đồ họa.
Các lĩnh vực của đồ họa máy tính:
Kỹ thuật xử lý ảnh (Computer Imaging) cho phép tạo ra ảnh số từ các đối tượng thông qua nhiều phương pháp phức tạp Trong quá trình này, các kỹ thuật như khôi phục ảnh, làm nổi ảnh và xác định biên ảnh được áp dụng để cải thiện chất lượng và độ chính xác của hình ảnh.
Kỹ thuật nhận dạng (Pattern Recognition) cho phép phân loại hình ảnh dựa trên các cấu trúc và tiêu chí đã xác định trước Bằng cách sử dụng các thuật toán chọn lọc, kỹ thuật này giúp phân tích và tổng hợp các hình ảnh gốc, được lưu trữ trong một thư viện Từ thư viện này, chúng ta có thể phát triển các thuật giải hiệu quả cho việc phân tích và tổ hợp hình ảnh.
Kỹ thuật tổng hợp ảnh là lĩnh vực nghiên cứu và phát triển các mô hình cũng như hình ảnh của các vật thể, dựa trên việc phân tích các đối tượng và mối quan hệ giữa chúng.
Các hệ CAD/CAM (Hệ thống thiết kế và sản xuất hỗ trợ bằng máy tính) là những công nghệ đồ họa tích hợp, cung cấp các công cụ và kỹ thuật hỗ trợ thiết kế chi tiết và các hệ thống khác nhau.
Kỹ thuật đồ họa 2 chiều
Kỹ thuật đồ họa 3 chiều bao gồm nhiều lĩnh vực như đồ họa minh họa, nơi sử dụng các công cụ để hiển thị số liệu thí nghiệm một cách trực quan thông qua các mẫu đồ thị và thuật toán có sẵn Bên cạnh đó, đồ họa hoạt hình và nghệ thuật cung cấp các công cụ cho họa sĩ và nhà thiết kế phim hoạt hình chuyên nghiệp, giúp tạo ra các kỹ xảo hoạt hình và tranh vẽ, ví dụ như phần mềm Studio, 3D Animation và 3D Studio Max.
Các ứng dụng tiêu biểu của kỹ thuật đồ họa
Đồ họa máy tính là lĩnh vực hấp dẫn và phát triển nhanh chóng trong tin học, thu hút sự quan tâm từ nhiều ngành nghề như khoa học, nghệ thuật, kinh doanh và quản lý Sức lôi cuốn của đồ họa máy tính được thể hiện rõ nét qua các ứng dụng đa dạng và trực quan của nó.
Xây dựng giao diện người dùng (User Interface):
Giao diện đồ họa đã cách mạng hóa trải nghiệm người dùng, mang lại sự thuận tiện và thoải mái khi sử dụng ứng dụng Giao diện WYSIWYG và WIMP được ưa chuộng nhờ tính thân thiện và dễ sử dụng, đáp ứng nhu cầu ngày càng cao của người dùng.
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 sử dụng để tóm tắt dữ liệu trong các lĩnh vực như tài chính, thống kê, kinh tế, khoa học và toán học, nhằm hỗ trợ nghiên cứu và quản lý một cách hiệu quả.
Tự động hóa 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.
TỔNG QUAN VỀ KỸ THUẬT ĐỒ HỌA 3D
Giới thiệu 3D graphics
Hình ảnh 3D, lần đầu tiên được giới thiệu bởi ngài Charlets Wheastone vào năm 1833, đã trở nên phổ biến trong nhiều lĩnh vực nhờ vào sự phát triển của công nghệ Sự giảm giá của thiết bị kỹ thuật số, cải thiện băng thông mạng và các chuẩn nén, cùng với tiến bộ trong công nghệ hiển thị, đã giúp công nghệ 3D nổi lên như một xu hướng tương lai Công nghệ hiển thị lập thể rất hữu ích trong nhiều ứng dụng, bao gồm hệ thống mô phỏng, y học, robot học, thiết kế hỗ trợ máy tính, viễn thông và giải trí.
Dưới đây là một số hình ảnh minh hoạ cho ứng dụng của 3D:
Hình 2.1 : 3D trong giải trí (Games)
Hình 2.2: 3D trong Y học (Medical Imaging)
Hình 2.3: 3D trong hoạt hình (Animation)
Hình 2.4: 3D trong thiết kế (Computer Aided)
Trước khi tạo đồ họa 3D và truyền tải qua mạng, cần nắm vững từ vựng và khái niệm cơ bản về đồ họa 3D cùng hệ thống tọa độ của nó Điều này giúp hiểu rõ lý do tại sao đồ họa 3D hiển thị trên màn hình máy tính phẳng.
Hình 2.6: Quy trình hiển thị
Nhận thức về 3D
“3D computer graphics” thực chất là hình ảnh hai chiều trên màn hình máy tính phẳng, nhưng tạo ra ảo ảnh về độ sâu hay kích thước thứ ba Để trải nghiệm hình ảnh 3D, người xem cần sử dụng cả hai mắt, mỗi mắt nhận một ảnh riêng biệt và độc đáo của đối tượng Mỗi mắt sẽ tiếp nhận một ảnh hai chiều trên võng mạc, với sự khác biệt nhẹ do góc nhìn khác nhau Bộ não sau đó sẽ kết hợp hai ảnh này để tạo ra một bức tranh 3D phức tạp trong nhận thức.
Hình 2.7: Cách đôi mắt nhìn thấy 3 kích thước Hiệu quả 3D sẽ đƣợc phóng đại bằng cách làm tăng góc giữa hai ảnh
Khi bạn che một mắt, bạn có thể nghĩ rằng mình vẫn nhìn thấy ba chiều, nhưng thực tế lại khác Hãy thử thí nghiệm đơn giản: đặt một cái cốc ở bên trái, ngoài tầm với của bạn, và che mắt phải bằng tay Bạn sẽ nhận thấy rằng việc ước lượng khoảng cách để với tới cái cốc trở nên khó khăn Tuy nhiên, khi bạn bỏ tay ra và lấy cốc, mọi thứ trở nên dễ dàng hơn Điều này cho thấy những người mất một mắt gặp khó khăn trong việc nhận biết khoảng cách.
Thế giới không trở thành 2D khi bạn che một mắt vì nhiều hiệu ứng 3D vẫn hiện diện trong không gian 2D, kích hoạt khả năng nhận thức độ sâu của não Một trong những gợi ý rõ ràng nhất là các đối tượng gần sẽ lớn hơn các đối tượng xa, hiện tượng này được gọi là phối cảnh Phối cảnh, cùng với màu sắc, bề mặt, ánh sáng, đánh bóng và cường độ màu, tạo nên nhận thức về hình ảnh ba chiều Chỉ cần phối cảnh cũng đủ để tạo ra hình ảnh 3D; ví dụ, hình lập phương vẫn xuất hiện như một đối tượng ba chiều chỉ với phối cảnh Tuy nhiên, nếu nhìn kỹ, bạn sẽ thấy mặt trước và mặt sau của hình lập phương hoán đổi vị trí, điều này xảy ra do não bộ không rõ ràng vì thiếu bề mặt trong quá trình vẽ.
Hình 2.8: Phối cảnh hình lập phương
Loại bỏ các đường ẩn (Hidden Line Removal)
Hình 2.8 chỉ thể hiện thông tin ba chiều nhưng không phân biệt được mặt trước và mặt sau của hình lập phương Khi quan sát một đối tượng ba chiều, mặt sau thường mờ hơn mặt trước Nếu hình lập phương trong hình 2.8 là thể rắn, bạn sẽ không thấy các góc ở phía sau, giúp tránh nhầm lẫn với các góc ở phía trước Để mô phỏng điều này trong vẽ hai chiều, các đường bị tối đi do mặt trước sẽ được loại bỏ, quá trình này được gọi là loại bỏ đường ẩn, như minh họa trong hình 2.9.
Hình 2.9: Hình lập phương sau khi loại bỏ các đường ẩn
Color và shading
Hình 2.9 không phản ánh chính xác hình dạng của một khối lập phương thực Các mặt của hình chỉ có màu giống như màu nền, khiến cho người xem chỉ nhìn thấy các cạnh phía trước Trong khi đó, một khối lập phương thực tế sẽ có nhiều màu sắc và bề mặt khác nhau.
Một hình lập phương bằng gỗ thể hiện màu sắc và độ rám của gỗ Khi tô màu đồng nhất và biểu diễn dưới dạng hai chiều trên máy tính, chúng ta sẽ thấy hình ảnh tương ứng như trong hình 2.10.
Hình 2.10: Hình lập phương có mầu và không có shading
Chúng ta sẽ trở lại với đối tượng hai chiều và vẽ rõ các cạnh bằng một màu khác Để tạo ra phối cảnh cho đối tượng rắn, chúng ta có thể sử dụng ba mặt nhìn thấy với màu sắc khác nhau hoặc giữ cùng một màu nhưng đánh bóng để tạo ảo giác về ánh sáng, như thể hiện trong hình 2.11.
Hình 2.11: Hình lập phương với đánh bóng khác nhau trên 3 mặt
Light và shadows
Một phần tử cuối cùng không thể không nói đến là ánh sáng (Lighting)
Bố trí ánh sáng ảnh hưởng đến đối tượng hiển thị ba chiều theo hai cách quan trọng Đầu tiên, nó tạo ra bóng cho bề mặt, giúp màu sắc không bị thay đổi khi nhìn từ các góc khác nhau Thứ hai, ánh sáng tạo bóng đổ cho đối tượng khi bị chặn bởi chính nó.
Hình 2.12: Hình lập phương đặc được chiếu sáng bằng ánh sáng đơn
Ánh sáng có vai trò quan trọng trong việc ảnh hưởng đến các đối tượng ba chiều Có hai loại nguồn sáng chính: ánh sáng xung quanh, tạo ra sự chiếu sáng đồng đều và làm nổi bật hiệu ứng bóng trên các đối tượng màu đặc; và đèn, được sử dụng để điều chỉnh bóng đổ của các đối tượng và tạo ra hiệu ứng bóng đổ rõ nét hơn.
Hệ thống toạ độ (Coordinate Systems)
Khi vẽ các đối tượng trên màn hình máy tính, bạn cần xác định vị trí của chúng thông qua hệ tọa độ hàng và cột, điều này giúp mắt quan sát được ba chiều trên bề mặt hai chiều.
Ví dụ theo màn hình chuẩn VGA có 640 pixels từ trái sang phải và có
Màn hình có độ phân giải 480 pixels theo chiều dọc Để xác định một điểm ở giữa màn hình, bạn cần chỉ định tọa độ (320, 240), tức là 320 pixels từ bên trái và 240 pixels từ đỉnh màn hình.
Trong OpenGL, khi tạo cửa sổ vẽ, bạn cần xác định hệ thống tọa độ và cách ánh xạ tọa độ lên pixel trên màn hình Bài viết này sẽ trình bày cách áp dụng nguyên lý này để vẽ hai chiều, sau đó mở rộng cho ba chiều.
2.7.1 Hệ toạ độ đề các 2D
Hệ thống tọa độ phổ biến nhất để vẽ đồ thị hai chiều là hệ tọa độ Đề-các, trong đó tọa độ x đo theo chiều ngang và tọa độ y đo theo chiều đứng.
Gốc của hệ tọa độ là điểm (0,0), với tọa độ Đề-các được biểu diễn dưới dạng (x,y) và ngăn cách bởi dấu phẩy Hệ tọa độ Đề-các hai chiều, như hình 2.13, rất phổ biến trong giáo dục Hiện nay, các chế độ Windows khác nhau dẫn đến việc tọa độ khi vẽ sẽ được dịch chuyển khác nhau, tạo ra ánh xạ từ không gian tọa độ thực vào tọa độ Windows.
Hình 2.13: Mặt phẳng đề các
Cửa sổ đồ họa được đo bằng pixel, và trước khi vẽ các đối tượng như điểm, đường, và hình, bạn cần thông báo cho thư viện đồ họa (như OpenGL) về cách chuyển đổi các tọa độ đã cho thành tọa độ màn hình Việc này được thực hiện bằng cách xác định vùng không gian đề các mà cửa sổ chiếm, gọi là clipping area Trong không gian hai chiều, clipping area được xác định bởi các giá trị x, y tối đa và tối thiểu trong cửa sổ Một cách khác để chỉ ra clipping area là cung cấp tọa độ vị trí gốc và mối quan hệ trong cửa sổ.
2.7.3 Cổng nhìn, cửa sổ của bạn đến 3D
Chiều rộng và chiều cao của clipping area thường không khớp chính xác với kích thước cửa sổ theo pixel, vì vậy cần ánh xạ hệ thống tọa độ từ tọa độ đề các logic sang tọa độ pixel trên màn hình Phép ánh xạ này được thực hiện thông qua cổng nhìn (Viewport), là khu vực bên trong khu vực khách của cửa sổ mà sẽ được sử dụng để vẽ clipping area Cổng nhìn giúp ánh xạ clipping area vào một phần của cửa sổ, thường là toàn bộ cửa sổ, nhưng trong một số trường hợp, bạn có thể chỉ muốn vẽ một phần nhất định, chẳng hạn như nửa dưới của cửa sổ.
Hình 2.15 minh họa một cửa sổ lớn với kích thước 300x200 pixels, hiển thị toàn bộ khu vực client Nếu vùng cắt cho cửa sổ được thiết lập từ 0 đến 150 theo trục x và từ 0 đến 100 theo trục y, thì tọa độ logic sẽ được ánh xạ đến tọa độ màn hình lớn hơn trong cửa sổ Mỗi lần tăng trong hệ thống tọa độ logic tương ứng với hai lần tăng trong hệ thống tọa độ vật lý của cửa sổ tính theo pixel.
Hình 2.15: Cổng nhìn đƣợc xác định bằng 2 lần clipping area
Hình 2.16 minh họa một cổng nhìn tương ứng với vùng cắt (clipping area), trong khi kích thước cửa sổ nhìn vẫn giữ nguyên là 300x200 pixels Do đó, vùng nhìn sẽ được xác định nằm ở góc dưới bên trái của cửa sổ.
Hình 2.16: Cổng nhìn có cùng kích thước với clipping area
Bạn có thể sử dụng cổng nhìn để điều chỉnh kích thước hiển thị của ảnh trong cửa sổ Windows, cho phép phóng to hoặc thu nhỏ hình ảnh Bằng cách thiết lập cổng nhìn lớn hơn khu vực khách (client area) của cửa sổ, bạn có thể chỉ hiển thị một phần của vùng cắt (clipping area).
2.7.4 Vẽ hình cơ bản (Primitives)
Khi vẽ một đối tượng trong 2D hoặc 3D, bạn thực chất đang sử dụng các hình nhỏ hơn gọi là primitives Primitives có bề mặt hai chiều như điểm, đường và hình đa giác, được tập hợp trong không gian ba chiều để tạo ra các đối tượng 3D Ví dụ, hình lập phương được hình thành từ 6 hình vuông hai chiều, mỗi hình vuông nằm trên một mặt riêng biệt Mỗi góc của hình vuông hay bất kỳ hình cơ bản nào được gọi là đỉnh (vertex), và các đỉnh này được đặt tại các tọa độ cụ thể trong không gian 2D hoặc 3D Tất cả các thư viện đồ họa như OpenGL và DirectX đều hỗ trợ các hình cơ bản này.
Chúng ta sẽ mở rộng hệ thống tọa độ 2D sang hệ thống tọa độ 3D bằng cách thêm một thành phần độ sâu Hệ thống tọa độ 3D bao gồm ba trục: x, y và z, trong đó trục z vuông góc với cả hai trục x và y Ví dụ, điểm (-4, 4, 4) được biểu diễn trong không gian ba chiều với ba kích thước x, y và z.
Hình 2.17: Toạ độ đề các ba chiều
Các phép biến đổi hình học 3 chiều
2.8.1 Hệ tọa độ thuần nhất
Hệ tọa độ thuần nhất (Homogeneous Coordinates) cho phép biểu diễn mỗi điểm (x,y,z) trong không gian Descartes bằng một bộ bốn tọa độ trong không gian 4 chiều, thường là (hx, hy, hz, h) với h=1 Các phép biên đổi tuyến tính bao gồm tỉ lệ, quay, biến dạng và đối xứng, và chúng có những tính chất đặc biệt quan trọng trong toán học và đồ họa máy tính.
Gốc tọa độ là điểm bất động Ảnh của các đường thẳng song song là đường thẳng song song Bảo toàn tỷ lệ khoảng cách
Tổ hợp các phép biến đổi có tính phân phối
Ma trận biến đổi tổng quát trong hệ tọa độ thuần nhất (4x4) s n m l r j i g q f e d p c b a
, , dz z dy y dx x dz dy dx T z y x z y x dz dy dx T X X dz dy dx dz dy dx
Với Sx, Sy, Sz là các hệ số tỷ lệ trên các trục tọa độ
Ta có tất cả các phần tử nằm trên đường chéo chính bằng 1 Các phần tử chiếu và tịnh tiến bằng 0
1 z fy cx iz y bx gz yd x
Qua mặt phẳng tọa độ
0 0 0 1 : z Mr xOy y Mr zOx x Mr yOx
Phép chiếu và bản chất của ba chiều
OpenGL chuyển đổi tọa độ đề các ba chiều thành tọa độ hai chiều thông qua việc sử dụng lượng giác học và thao tác ma trận Mặc dù các pixel trên màn hình chỉ có hai chiều, nhưng bạn không cần phải là chuyên gia toán học để sử dụng OpenGL cho việc vẽ đồ họa Để hiểu rõ hơn về quá trình này, bạn có thể tham khảo chương 7 của cuốn sách “OpenGL Super Bible”.
Khái niệm phép chiếu (projection) là yếu tố quan trọng cần hiểu trong việc chuyển đổi tọa độ 3D lên bề mặt 2D (nền cửa sổ) Quá trình này giống như việc chèn phác thảo các đối tượng phía sau tấm kính bằng một dấu đen Khi lối tượng di chuyển hoặc bạn thay đổi vị trí của tấm kính, hình dáng bên ngoài của đối tượng vẫn có thể được nhìn thấy với các cạnh góc của nó Ví dụ, hình 2.18 minh họa một ngôi nhà được vạch ra trên một miếng kính phẳng Qua phép chiếu, bạn có thể xác định clipping volume (khu vực cắt) mà bạn muốn hiển thị trên cửa sổ và cách thức nó sẽ được dịch chuyển.
Hình 2.18: Một ảnh đƣợc chiếu lên bề mặt 2D
2.9.1 Phép chiếu Định nghĩa phép chiếu : Một cách tổng quát, phép chiếu là phép chuyển đổi những điểm của đối tƣợng trong hệ thống tọa độ n chiều thành những điểm trong hệ thống tọa độ có số chiều nhỏ hơn n Định nghĩa về hình chiếu : Ảnh của đối tƣợng trên mặt phẳng chiếu được hình thành từ phép chiếu bởi các đường thẳng gọi là tia chiếu (projection) xuất pháp từ một điểm gọi là tâm chiếu (center of projection) đi qua các điểm của đối tƣợng giao với mặt chiếu (projection plan)
Các bước xây dựng hình chiếu Đối tƣợng trong không gian 3D với tọa độ thực đƣợc cắt theo một không gian xác định gọi là view volume
View volume dƣợc chiếu lên mặt phẳng chiếu Diện tích chắn bởi view volume trên mặt phẳng chiếu đó sẽ cho chúng ta khung nhìn
Là việc ánh xạ khung nhìn vào trong một cổng nhìn bất kỳ cho trước trên màn hình để hiển thị hình ảnh
Hình 2.19: Mô hình nguyên lý của tiến trình biểu diễn đối tƣợng 3D
TỌA ĐỘ THEO VÙNG CẮT
PHÉP CHIẾU TRÊN MẶT PHẲNG CHIẾU
PHÉP BIẾN ĐỔI VÀO CỔNG NHÌN CỦA TỌA ĐỘ THIẾT BỊ
2.9.2 Phép chiếu song song (Parallel Projections)
Phép chiếu song song (Parallel Projections) là phép chiếu mà ở đó các tia chiếu song song với nhau hay xuất phát từ điểm vô cùng
Phân loại phép chiếu song song dựa trên huớng của tia chiếu (Direction Of Projection) và mặt phẳng chiếu (projection plane)
2.9.2.1 Phép chiếu trực giao (Orthographic projection)
Là phép chiếu song song và tia chiếu vuông góc với mặt phẳng chiếu
Phép chiếu trực giao trong toán học là phép chiếu lên một trong các mặt phẳng tọa độ có giá trị bằng 0, thường là mặt phẳng z=0, bên cạnh đó còn có x=0 và y=0 Mỗi mặt phẳng chiếu tương ứng với một ma trận chiếu đặc trưng.
Hình 2.20: Phép chiếu trực giao
Thông thường, chỉ một trong ba mặt phẳng chính như hình chiếu bằng, hình chiếu đứng hoặc hình chiếu cạnh được sử dụng để suy diễn ngược hình của một đối tượng, thay vì sử dụng cả sáu mặt phẳng.
Tất cả sáu góc nhìn có thể được thu nhận từ một mặt phẳng chiếu thông qua các phép biến đổi hình học như quay, dịch chuyển và đối xứng.
Khi có hình chiếu bóng trên mặt phẳng z=0, việc quay đối tượng quanh trục một góc 90 độ sẽ tạo ra hình chiếu cạnh Tuy nhiên, đối với những đối tượng có các mặt không song song với các mặt phẳng hệ tọa độ, phép chiếu này không thể hiện đúng hình dạng thực của vật thể Để quan sát vật thể một cách chính xác hơn, cần phải thực hiện phép chiếu thông qua việc quay và dịch chuyển đối tượng sao cho mặt phẳng chiếu song song với các trục tọa độ.
Hình của đối tƣợng quá phức tạp cần thiết phải biết các phần bên trong của đối tƣợng đôi lúc chúng ta phải tạo mặt cắt đối tƣợng
2.9.2.2 Phép chiếu trục lƣợng (Axonometric)
Phép chiếu trục lƣợng là phương pháp chiếu hình ảnh của một đối tượng sau khi được quay, nhằm làm rõ ba mặt của đối tượng Thông thường, mặt phẳng chiếu được đặt tại z=0 để tối ưu hóa sự hiển thị.
2.9.3 Phép chiếu phối cảnh (Perspective Projection)
Phép chiếu phối cảnh là
Phép chiếu phối cảnh tạo ra hiệu ứng về luật xa gần, mang lại cảm giác về độ sâu của đối tượng trong thế giới thực, điều mà phép chiếu song song không thể diễn tả được.
Các đoạn thẳng song song của mô hình 3D sau phép chiếu hội tụ tại một điểm gọi là điểm triệt tiêu (vanishing point)
Phân loại phép chiếu phối cảnh dựa vào tâm chiếu - Centre Of Projection (COP) và mặt phẳng chiếu - projection plane
Hình 2.21: Phép biến đổi phối cảnh
2.9.3.1 Phép chiếu phối cảnh một tâm chiếu
Giả sử khi mặt phẳng đƣợc đặt tại z = 0 và tâm phép chiếu nằm trên trục z, cách trục z một khoảng zc = -1/r
Nếu đối tƣợng cũng nằm trên mặt phẳng z = 0 thì đối tƣợng sẽ cho hình ảnh thật
Hình 2.22 : Phép chiếu phối cảnh một tâm chiếu
- Ma trận biến đổi một điểm phối cảnh [ Tr ] có dạng:
2.9.3.2 Phép chiếu phối cảnh hai tâm chiếu
Hình 2.23: Phép chiếu phối cảnh hai tâm chiếu
qy px z qy px y qy px z x y x qy px z y q x p z y x q p T q p q p
Hai tâm chiếu: [-1/p 0 0 1] và [ 0 -1/q 0 1 ] Điểm triêu tiêu (VP – Vanishing point) tương ứng trên 2 trục x và y là điểm: [ 1/p 0 0 1 ] và [ 0 1/q 0 1 ]
2.9.3.3 Phép chiếu phối cảnh ba tâm chiếu
Hình 2.24 : Phép chiếu phối cảnh ba tâm chiếu
rz qy px z rz qy px y rz qy px z x y x rz qy px z y r x q p z y x r q p r q p T
Tr Tq Tp Tpqr z pqr c
Ba tâm chiếu: trên trục x tại điểm [ -1/p 0 0 1 ], y tại điểm [ 0 -1/q 0 1 ] và z tại điểm [ 0 0 -1/r 1 ] Điểm triệt tiêu – VP sẽ tương ứng với các giá trị:
Hình2.25: Hình đƣợc chiếu sáng
TỔNG QUAN VỀ SILVERLIGHT
Sự ra đời của Silverlight
Ngày nay, các doanh nghiệp phần mềm gặp nhiều khó khăn trong việc phát triển ứng dụng Web do sự hỗ trợ không đồng đều từ trình duyệt và hệ điều hành Họ mong muốn sử dụng các ngôn ngữ và công cụ phát triển quen thuộc để tạo ra ứng dụng hoạt động tốt trên mọi nền tảng Silverlight ra đời như một giải pháp công nghệ hữu ích, cho phép các doanh nghiệp thực hiện điều này một cách hiệu quả Nếu bạn đã quen thuộc với Net Framework, việc tiếp cận với Silverlight sẽ giúp tiết kiệm đáng kể thời gian và chi phí cho việc phát triển ứng dụng Web mới.
Trước đây, các công nghệ plug-in trên Web không hỗ trợ truyền tải dữ liệu hình ảnh chất lượng cao như 720p HDTV Tuy nhiên, với sự cải thiện của chất lượng đường truyền mạng và nhu cầu ngày càng tăng về video chất lượng cao, Silverlight đã ra đời, mang lại sự thỏa mãn thực sự cho những người đam mê đa phương tiện.
Silverlight ra đời như một đối thủ mạnh mẽ của Adobe Flash, với những ưu điểm vượt trội như tính nhỏ gọn, khả năng đa nền tảng, và bộ công cụ phát triển hoàn chỉnh Đặc biệt, Silverlight được phát triển bởi Microsoft, công ty hàng đầu trong lĩnh vực phần mềm, giúp nó thừa hưởng những công nghệ tiên tiến nhất.
Định nghĩa Silverlight
Silverlight là một plug-in công nghệ của Microsoft Net, hỗ trợ phát triển ứng dụng web trên nhiều nền tảng và trình duyệt khác nhau Nó cung cấp một mô hình lập trình linh hoạt và đồng nhất, tương thích với các ngôn ngữ lập trình như Ajax, Python, Ruby, cũng như các ngôn ngữ Net như Visual Basic và C#.
Silverlight sở hữu khả năng đa phương tiện vượt trội, cho phép truyền tải âm thanh và hình ảnh chất lượng cao một cách nhanh chóng và hiệu quả Công nghệ này tương thích với tất cả các trình duyệt chính như Internet Explorer, Firefox và Safari.
Bằng cách sử dụng Expression Studio và Visual Studio, các nhà phát triển và thiết kế có thể hợp tác hiệu quả hơn, tận dụng kỹ năng hiện có để phát triển các sản phẩm web tương lai, góp phần "thắp sáng web".
Đặc tính của Silverlight
Silverlight tích hợp nhiều công nghệ trong một nền tảng phát triển, cho phép người dùng lựa chọn các công cụ và ngôn ngữ lập trình phù hợp để giải quyết các vấn đề của mình.
3.3.1 Sự kết hợp của WPF và XAML
Silverlight là một công nghệ mở rộng của Windows Presentation Foundation (WPF), cho phép tạo giao diện người dùng phong phú hơn trong trình duyệt Nó hỗ trợ đồ họa 3 chiều, hình ảnh động và đa phương tiện, mang đến nhiều tính năng hấp dẫn trên máy khách XAML (Extensible Application Markup Language) cung cấp cú pháp đánh dấu đặc trưng cho việc tạo các Element trong ứng dụng.
3.3.2 Mở rộng cho ngôn ngữ kịch bản
Silverlight mở rộng khả năng của ngôn ngữ kịch bản Javascript trên nhiều trình duyệt phổ biến, giúp cải thiện việc trình bày giao diện và nâng cao trải nghiệm người dùng.
3.3.3 Sự tích hợp với các ứng dụng đã có
Silverlight tích hợp dễ dàng với Javascript và mã Ajax của ASP.Net, giúp mở rộng các chức năng đã phát triển Bạn có thể tạo tài nguyên trên máy chủ với ASP.Net và sử dụng khả năng của Ajax để tương tác với những tài nguyên này mà không gây gián đoạn cho người dùng.
3.3.4 Sử dụng mô hình ngôn ngữ lập trình trên nền tảng Net Framework và các công cụ để kết hợp
Bạn có thể phát triển ứng dụng trên nền tảng Silverlight bằng cách sử dụng các ngôn ngữ lập trình như C#, Visual Basic và IronPython Để tạo ra các ứng dụng này, bạn có thể sử dụng các công cụ phát triển mạnh mẽ như Visual Studio.
Silverlight hỗ trợ giao thức HTTP qua TCP, cho phép kết nối tới các dịch vụ WCF, SOAP và ASP.NET AJAX Người dùng có thể nhận dữ liệu dưới các định dạng cấu trúc như XML, JSON hoặc RSS.
3.3.6 Hỗ trợ ngôn ngữ tích hợp truy vấn Điều này cho phép bạn truy cập dữ liệu bằng cách sử dụng cú pháp trực quan tự nhiên và mạnh mẽ, đƣợc gõ bởi các đối tƣợng có trong các ngôn ngữ Net Framework
3.4 Kiến trúc tổng thể và các mô hình lập trình của Silverlight
3.4.1 Kiến trúc và các thành phần
Silverlight là một nền tảng tích hợp, bao gồm nhiều thành phần khác nhau Dưới đây là bảng tóm tắt các thành phần chính của Silverlight.
Nền tảng trình bày cơ sở
Các thành phần dịch vụ tập trung vào giao diện và tương tác người dùng, bao gồm các điều khiển cho dữ liệu nhập từ người dùng, thiết bị đa phương tiện, quản lý phân quyền số, trình bày dữ liệu, đồ họa vector, văn bản, hình ảnh động, và sử dụng XAML để xác định bố trí giao diện.
.NET Framework là một gói phần mềm bao gồm các thành phần và thư viện, cung cấp khả năng tương tác dữ liệu, mở rộng control, hỗ trợ mạng, quản lý bộ nhớ (garbage collection) và thực thi mã (CLR).
Cài đặt và cập nhật là các thành phần quan trọng giúp đơn giản hóa quy trình cài đặt ban đầu, đồng thời cung cấp cơ chế tự động cập nhật với mức độ tương tác tối thiểu.
Dưới đây là hình ảnh mô tả những thành phần trong kiến trúc của Silverlight cùng với các thành phần và dịch vụ liên quan khác
Hình 3.2: Thành phần kiến trúc của Slverlight
Xử lý dữ liệu đầu vào từ các thiết bị phần cứng như bàn phím, chuột, bảng vẽ và các thiết bị đầu vào khác là rất quan trọng Điều này giúp trình bày giao diện người dùng một cách hiệu quả và thân thiện.
Trình bày vector và các đồ họa ảnh bitmap, ảnh động, và văn bản
Các tính năng phát và quản lý một vài thể loại flie âm thanh và hình ảnh nhƣ WMP và MP3
Các control hỗ trợ mở rộng cho phép tùy chỉnh về kiểu dáng và khuôn mẫu, mang đến sự linh hoạt cho người dùng Tính năng xếp đặt layout cho phép điều chỉnh vị trí động của các thành phần giao diện, tạo ra trải nghiệm tương tác mượt mà hơn Bên cạnh đó, khả năng trình bày dữ liệu cũng được cải thiện, giúp người dùng dễ dàng quản lý và phân tích thông tin.
Cho phép việc kết nối dữ liệu của các đối tƣợng và các thành phần giao diện người dùng
DRM Khả năng Quản lý phân quyền số
XAML Cung cấp trình phân tách cho XAML
Các lập trình viên có thể sử dụng XAML để thao tác với các thành phần của nền tảng trình bày cơ sở, điều này giúp họ tương tác hiệu quả hơn với Net Framework và các kiểu trình bày Layout Ngoài ra, họ cũng có thể sử dụng cơ chế quản lý code bên trong để điều chỉnh và thao tác với các yếu tố trình bày.
LINQ (Ngôn ngữ truy vấn tích hợp) hỗ trợ việc làm việc với dữ liệu từ nhiều nguồn khác nhau một cách dễ dàng, đặc biệt là thông qua việc sử dụng XML và các lớp biến đổi hóa (serialization) Điều này giúp đơn giản hóa quá trình tích hợp và xử lý dữ liệu hiệu quả.
Khả năng hỗ trợ trình duyệt, hệ điều hành và các công nghệ liên quan
Hình 3.3: Bảng mô tả hỗ trợ trình duyệt và hệ diều hành
3.5.2 Các công nghệ và công cụ liên quan của Silverlight
Microsoft Expression Blend cho phép người dùng tạo và điều chỉnh cách sắp xếp các lớp (Layer) trong ứng dụng thông qua việc thao tác trên canvas và các control trong XAML Công cụ này hỗ trợ các chức năng đồ họa và lập trình với ngôn ngữ Javascript, mang lại trải nghiệm thiết kế linh hoạt và sáng tạo cho các nhà phát triển.
Visual Studio 2008 cung cấp công cụ mạnh mẽ cho việc phát triển ứng dụng hỗ trợ thao tác code, với khả năng hỗ trợ Silverlight trong tất cả các phiên bản Phiên bản mới này còn bổ sung các tính năng đặc biệt như Intellisense, khả năng gỡ lỗi (debugging) và các mẫu (template) để tạo ứng dụng Silverlight mới.
ASP.NET AJAX: Bao gồm tập các Control, service, và các thƣ viện cần thiết cho việc tạo và tương tác với nền ứng dụng web
Microsoft ASP.NET 3.5 Extensions Preview: Công nghệ này cung cấp chức năng thêm để việc tăng cường các ứng dụng ASP.NET AJAX
Nó bao gồm 2 control sử dụng hữu ích cho việc xây dựng nền tảng silverlight cũng nhƣ là một phần ứng dụng ASP.NET:
- ASP.NET MediaPlayer Server Control
- ASP.NET Silverlight Server Control
Internet server: Bao gồm IIS (Microsoft Internet Information Services), và Apache Web server
Microsoft Windows Communication Foundation (WCF) services.
Hướng dẫn cài đặt và sử dụng công cụ Silverlight trên visual studio 2008
- Tải file Silverlight_tools.exe có trên trang: http://www.microsoft.com/downloads/details.aspx?familyidd6A7 B-546F-4407-8FE6-D60C8EE221ED&displaylang=en
- Bạn phải chắc chắn rằng máy tính của bạn đã cài đặt Visual Studio
- Chạy file Silverlight_tools.exe, chờ khoảng 1 phút để hiện thị Silverlight tools installation Winzard
- Bấm next để đến bước 2, tích chọn “ I have read an accept the license terms”
- Bấm next để hệ thống tự động kiểm tra tương thích ( lưu ý:phải đóng hết các trình duyệt web)
- Để hệ thống cài đặt và hoàn thành
3.7 Ví dụ thực hành :Chương trình đầu tiên “Hello World”
- Tạo mới một Project: chọn File → New → Project
- Một cửa sổ mới “New Project” hiện ra Chọn Visual C# ( hoặc Visual basic) trong project types, chọn Silverlight Phía bên phải cửa sổ cho phép bạn chọn các Template
Chúng ta chọn SilverlightApplication trong Templates
Đặt tên chương trình đầu tiên là “Hellworld”, tùy chọn Location, bấm OK
Bạn có thể chọn ProjectType theo mặc định trong hội thoại Add Silverlight application, bấm OK
Solution mới tạo ra với 2 project: Silverlightproject và web project (dung để nhúng silverlight tạo bởi silverlight project)
Trong thƣ mục ClientBin của web project (HelloWorld.Web) chứa ứng dụng silverlight được đóng gói dưới dạng file HelloWorld.xap của project silverlight(HelloWorld)
Toàn bộ màn hình ứng dụng đầu tiên của bạn đƣợc nhìn thấy nhƣ sau:
- Chúng ta làm 2 phương pháp một là viết code C# trong code ứng dụng, hai là viết trực tiếp trong XAML
3.7.1 Viết chương trình bằng Code C#
- Trong file Page.xaml.cs chúng ta bắt đầu với việc tạo một nút theo những dòng lệnh dưới đây
- Để tạo sự kiện cho một nút chúng ta cần thêm những dòng lệnh sau vào
- Bấm F5 để chạy chương trình
3.7.2 Viết chương trình bằng XAML
Khi làm việc với cùng một project, để viết đặc tả bằng XAML, bạn cần xóa bỏ mã C# cũ, vì C# và XAML không thể cùng tạo ra một đối tượng.
- Bấm F5 để chạy ứng dụng Cả hai phương thức viết trên đều cho ra một kết quả nhƣ hình vẽ sau:
XÂY DỰNG ALBUM ẢNH 3D BẰNG SILVERLIGHT
Giới thiệu ứng dụng
Silverlight 3 đã tung ra một loạt các tính năng mới có sẵn cho người dùng phát triển, và một trong đó sẽ cung cấp một cấp độ mới của thiết kế giao diện người dùng là việc giới thiệu quan điểm 3D Tính năng này cho phép người dùng áp dụng cho bất kỳ UIElement để cung cấp cho sự hiển thị 3 chiều
Trong chương này, chúng ta sẽ tạo ra một FlipBook đơn giản, cho phép người dùng dễ dàng lướt qua các hình ảnh như trong một cuốn sách Khi người dùng nhấp vào một hình ảnh, nó sẽ "biến" để hiển thị những hình ảnh tiếp theo, mang đến trải nghiệm tương tác thú vị.
Đoạn mã xử lý chính
The `User Control` class in XAML defines a 3D projection interface, utilizing XML namespaces for presentation and design compatibility, with specified design dimensions of 640 by 480 pixels.