Đẩy mô hình lên trang Web

Một phần của tài liệu Áp dụng các mô hình 3D vào trong tạo lập web (Trang 54 - 61)

S d ng mô hình 3D ửụ

3.3.4Đẩy mô hình lên trang Web

Cách đơn giản nhất và dễ thực hiện nhất là coi mô hình sẽ là một đối tượng. Ví dụ như đoạn code sau:

<object id="A1" border="1"

width="100%" height="100%" type="application/x-oleobject" classid="CLSID:1"> - > khai báo một đối tượng

<param name="ConsoleMode" value="1"> <param name="CpuLoading" value="80">

<param name="NavigationBar" value="0"> -> ẩn thanh công cụ của vrml <param name="RendererName" value="DirectX Renderer">

<param name="Skin" value="{2E531535-D677-4955-A2A5-

B8EEFF18A172};./viewx1.zip#Version=1,0,0,8" -> hỗ trợ của VRML

<param name="ShowLogo" value="False"> -> ẩn đi logo của vrml <param name="TravelSpeed" value="5">

<param name="WaitForAllResources" value="True"> <param name="BackColor" VALUE="&hC08080">

<param name="Scene" value="bike.wrl"> -> input file

</object>

Như đã nói ở trên, một mô hình tĩnh được đẩy lên trên trang Web, có thể dùng chuột để quay mô hình là do sự hỗ trợ của VRML cho IE.

Nếu không muốn dùng chuột có thể tương tác với mô hình có thể làm như sau:

◦ Khai báo phần NavigatioInfo với trường type là NONE

◦ Bỏ thẻ < param name = “Skin” value ={...} > Cách này hay sử dụng khi dùng mô hình 3D làm logo Để có thể tương tác với mô hình, có thể sử dụng hai cách: Cách 1: Sử dụng chuột để tương tác

◦ Khai báo NavigationInfo với trường type là FLY/WALK/EXAMINE

◦ Tạo Object, sử dụng thẻ <param name= “Skin” value={...}>

Cách 2: Hoạt hoá hoàn toàn bằng các node trong file VRML. Cách này người lập trình phải tự viết code trên file VRML. Sau đó, tạo object và đẩy mô hình lên bình thường

Lưu ý: chuột được sử dụng trong mô hình nên là chuột có đủ ba phím : phím trái, phím phải và phím ở giữa. Sử dụng phím trái để xoay mô hình, phím giữa để phóng to hoặc thu nhỏ mô hình.

Chương trình xây dựng được để minh hoạ cho đề tài sử dụng cả hai cách trên để hoạt hoá mô hình.

3.3.5 Thực nghiệm

Để phục vụ cho đề tài, em đã xây dựng một website quảng cáo xe đạp.

Hình 3.1: minh hoạ giao diện của mô hình

Các công cụ được sử dụng cho đề tài:

• Phần mềm dựng hình: Maya Ver 7.0

• Bộ cài để phục vụ cho máy Client tải file VRML: cortvrml 2.0

• Trình duyệt IE

Công việc tiến hành như sau:

• Dựng hình bằng Maya

• Xuất ra file định dạng các ảnh 2D : Gif, jpg. Hoặc:

• Xuất file về dạng VRML (adsbygoogle = window.adsbygoogle || []).push({});

 Tạo object là một mô hình tĩnh

Hình 3.2 : mô hình tĩnh không thể tương tác

 Tạo object là mô hình tĩnh có thể tương tác bằng chuột

Hình 3.3: minh hoạ mô hình tĩnh quay theo hai hướng khác nhau

 Tạo object là mô hình động do hoạt hoá

Có hai dạng mô hình chuyển động, một là click chuột vào thì mô hình mới chuyển động và hai là mô hình chuyển động liên tục.

 Tạo object là mô hình gắn với trục quay và thanh zoom

Hình 3.5: Mô hình xe đạp có thể dùng trục quay để quay và thanh kéo để zoom

 Tạo dòng text hoạt hoá

Hình 3.6: Dòng text được dựng bằng Maya và hoạt hoá bằng VRML

Mô tả website

Website em xây dựng được mô phỏng một cách đơn giản một Website bán hàng. Trang chủ của Website trình bày một số hình ảnh của xe đạp. Nếu người dùng muốn xem xét kĩ hơn một chiếc xe đạp nào đó thì click chuột vào ảnh của chiếc xe đó. Trang Web sẽ hiện ra các thông tin chi tiết của chiếc xe như: Tên nhà sản xuất, nơi sản xuất, giá thành, bảo hành v...v cùng với mô hình của chiếc xe đó. Mỗi một mô hình sẽ minh hoạ một cách tạo Object như đã trình bày ở trên.

Dưới đây là sơ đồ tiến trình minh hoạ tiến trình công việc mà em đã thực hiện. Cũng có thể coi sơ đồ này như là một qui trình kỹ thuật để tạo ra Web3D để tham khảo.

Hình 3.7- Sơ đồ tiến trình công việc

Kết luận

Dựng mô hình - modelling

Hoạt hóa - Animation

Tạo kết xuất – rendering Tối ưu hình - Rebuild Maya ver 7.0 VRML ver2.0 Đổ bóng-Shading Chiếu sáng- Animation Software VRML Kết xuất-Export Tạo Object trên trang Web

WEBSITE INTERN

Web3D là một xu hướng phát triển tất yếu của Web. Trên thế giới, đã có rất nhiều các quốc gia quan tâm đến Web3D. Tuy nhiên ở Việt Nam, Web3D chưa có một trang Web3D nào.

Giá trị thực tiễn của đề tài này là lớn. Thứ nhất, nó phù hợp với xu hướng phát triển của đồ hoạ 3D. Đồ hoạ 3D đang lan tràn trên rất nhiều lĩnh vực và mang lại một nguồn lợi không nhỏ cho các nhà kinh doanh. Thứ hai, nếu Web3D có mặt ở Việt Nam, nó sẽ góp phần để phát triển khuynh hướng sử dụng các mô hình 3D thực sự vào trong trang Web của Việt Nam.

Web3D không phải là vấn đề quá khó đến độ không thể thực hiện được. Vì thực tế đã xuất hiện nhiều trang Web3D trên thế giới, trong đó có nhiều hãng lớn như

Toyota, IBM, Samsung đã sử dụng các mô hình 3D thực sự vào trong Website của họ. Em cũng đã cài đặt thành công một Website quảng cáo xe đạp. Vì thế, em có thể khẳng định đề tài của em có tính khả thi, có giá trị thực tiễn.

Trong thời gian qua, với đề tài “Tìm hiểu một số kĩ thuật dựng hình 3D và áp dụng vào trong tạo lập Web”, quá trình tìm hiểu đã đi đến một số các thành quả sau:

o Tìm hiểu các kĩ thuật dựng hình, đổ bóng, ánh sáng cho mô hình và cách sử dụng các kĩ thuật đó vào từng trường hợp để có hiệu quả về chất lượng và dung lượng. Bởi vì đây là điều kiện cần để tải được các mô hình 3D lên trang Web

o Đẩy mô hình 3D lên Website, có thể dùng chuột để quay, zoom hoặc quay tự động. Đây là điều kiện đủ để một Web3D được hình thành.

Tuy nhiên, đề tài sẽ không dừng ở đó mà còn muốn nghiên cứu kĩ càng hơn nữa đề phát triển đề tài này.

Đầu tiên, đề tài sẽ tìm hiểu sâu hơn để người xem có thể tiếp cận kĩ càng hơn với các hình ảnh được xem. Ví dụ như: tách ghép các bộ phận của mô hình, zoom từng bộ phận được chọn trong mô hình, làm phim v.v.. Thêm nữa, các Website sử dụng nhiều mô hình động chắc chắn sẽ cho hiệu quả rất tốt. Vì thế, các mô hình đưa vào trong trang Web cần phải được hoạt hoá chuyên nghiệp hơn, có sự phối hợp giữa mô hình tĩnh và mô hình động.

Tuy nhiên, vấn đề đầu tiên là phải giảm được dung lượng của ảnh. Vì thế việc nén các face cũng là một hướng phát triển tiếp theo của đề tài này.

Tài liệu tham khảo (adsbygoogle = window.adsbygoogle || []).push({});

[1] Tài liệu đính kèm của phần mềm Maya Version 7.0, 3DStudioMax 6, sketchup

[2] H. Sanchez, A.Moreno, D.Oyarzun, A.García-Alonso.Evaluation of NURBS surfaces: an overview based on runtime efficiency

[3] http://web3d.vapourtech.com/ . Floppy’Web3D Guide [4] http://www.w3.org/TR/REC-html40/intro/intro.html [5] http://www.efuse.com/Design/index.html

Một phần của tài liệu Áp dụng các mô hình 3D vào trong tạo lập web (Trang 54 - 61)