intTypePromotion=1
zunia.vn Tuyển sinh 2024 dành cho Gen-Z zunia.vn zunia.vn
ADSENSE
 » 
 » 

TÌM HIỂU SVG VÀ ỨNG DỤNG - 10

Chia sẻ: Cao Tt | Ngày: | Loại File: PDF | Số trang:15

Thêm vào BST
Báo xấu
126
lượt xem 11
download
 
  Download Vui lòng tải xuống để xem tài liệu đầy đủ

Phụ lục A Ý nghĩa: tagLen chỉ định chiều dài thực sự của thẻ trong trường hợp này là 3 byte (ffffff). tagSetBackgroundColor thiết lập màu nền là màu trắng tagLen 2: tagDoAction action code 7 stop action code 0 Ý nghĩa: Dừng khung hình (hành động được thực hiện là Stop. Mã hành động là 0 có nghĩa là không còn hành động nào cần được thực hiện.) 3. VRML Một ví dụ về tập tin VRML: Hình A.1. Ví dụ về ảnh VRML Hình trên được phát sinh từ đoạn mã nguồn sau đây: (Nguồn: http://www.vrml.org/Specifications/VRML97/part1/introduction.html) #VRML V2.0 utf8 Transform { children [ NavigationInfo...

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: TÌM HIỂU SVG VÀ ỨNG DỤNG - 10

  1. P h ụ lụ c A Ý nghĩa: tagLen chỉ định chiều dài thực sự của thẻ trong trường hợp này là 3 byte (ffffff). tagSetBackgroundColor thiết lập màu nền là màu trắng tagLen 2: tagDoAction action code 7 stop action code 0 Ý nghĩa: Dừng khung hình (hành động được thực hiện là Stop. Mã hành động là 0 có nghĩa là không còn hành động nào cần được thực hiện.) 3. VRML Một ví dụ về tập tin VRML: Hình A.1. Ví dụ về ảnh VRML Hình trên được phát sinh từ đoạn mã nguồn sau đây: (Nguồn: http://www.vrml.org/Specifications/VRML97/part1/introduction.html) #VRML V2.0 utf8 Transform { children [ NavigationInfo { headlight FALSE } # We'll add our own light DirectionalLight { # First child direction 0 0 -1 # Light illuminating the scene } Transform { # Second child - a red sphere 180
  2. P h ụ lụ c A translation 3 0 1 children [ Shape { geometry Sphere { radius 2.3 } appearance Appearance { material Material { diffuseColor 1 0 0 } # Red } } ] } Transform { # Third child - a blue box translation -2.4 .2 1 rotation 0 1 1 .9 children [ Shape { geometry Box {} appearance Appearance { material Material { diffuseColor 0 0 1 } # Blue } } ] } ] # end of children for world } 4. HGML Sau đây là mô tả từng phần trong ba phần: • Các đối tượng đồ họa cơ bản • Chủ đề / sử dụng lại hình ảnh sẵn có • Chỉnh sửa ảnh 1. Các đối tượng đồ họa cơ bản Khái niệm này được đưa ra nhằm cho phép các ảnh được tải về và hiển thị trên mạng không dây nhanh hơn so với cách sử dụng chuẩn HTML. Ý tưởng này nằm ở chỗ giảm hoặc thay thế các ảnh bitmap lớn bằng các ảnh tương đương dựa trên đồ họa véc-tơ. Các ảnh véc-tơ này được vẽ bằng cách sử dụng một tập hợp được định nghĩa sẵn gồm các thẻ giống HTML liên quan đến các đối tượng đồ họa cơ bản. Các đối tượng này gồm các cấu trúc hình học như đường thẳng, đường tròn, hình vuông, 181
  3. P h ụ lụ c A đa giác, v.v… Sau đó các thành phần ảnh cơ bản này sẽ được vẽ độc lập với nhau bằng cách sử dụng các thẻ lệnh, chẳng hạn như sau: HGML cung cấp 18 thẻ sau, được chia thành ba nhóm ứng với ba danh mục được thể hiện trong bảng sau: Đối tượng đồ họa cơ bản Chủ đề ảnh Chỉnh sửa ảnh ARC CLIPART COPY ARROW THEME FLIP ELLIPSE PASTE LINE ROTATE LINETO LINEREL LINK ORIGIN POLYGON RECTANGLE SETSTYLE TEXT Bảng A.2. Danh sách 18 thẻ của HGML Nhóm đầu tiên trong bảng trên gồm các thẻ dùng cho các chức năng vẽ cơ bản, cho phép tạo một lượng các ảnh ghép đơn giản mà hiệu quả. Ví dụ: ARC Vẽ một cung có độ rộng, chiều cao và góc được chỉ định so với gốc tọa độ tuyệt đối.
  4. P h ụ lụ c A coords %COORDS #BẮT BUỘC -- gồm tọa độ gốc x,y của of cung, theo sau là độ rộng, độ cao, góc bắt đầu và góc của cung -- color %COLOR #NGẦM ĐỊNH -- màu sắ c của đường-- style %STYLE #NGẦM ĐỊNH -- kiểu của đường -- psize %PSIZE #NGẦM ĐỊNH -- độ dày của đường -- > 2. Chủ đề / sử dụng lại hình ảnh sẵn có HGML cung cấp một số ảnh được vẽ trước để dùng trong nội dung một trang. Các ảnh này dễ sử dụng hơn nhiều với các ảnh phải định nghĩa các đối tượng đồ họa cơ bản. Ví dụ: CLIPART Cho phép lấy một ảnh từ một nơi lưu trữ ngay trong máy tính và hiển thị lên ở các tọa độ xác định. 183
  5. P h ụ lụ c A 3. Chỉnh sửa ảnh HGML cho phép chỉnh sửa ảnh bitmap ngay trên màn hình bằng cách sử dụng các thẻ lệnh COPY, PASTE, FLIP and ROTATE. Những thẻ này được tạo ra nhằm tối ưu hóa việc tạo các kiểu chính của ảnh. Ví dụ, nếu một ảnh ghép được tạo bằng cách sử dụng một vài đối tượng đồ họa cơ bản thì điều này cũng được yêu cầu ở những vị trí khác trên màn hình. Do đó, nó có thể được sao chép đến vị trí mới mà không cần phải vẽ lại. Việc sao chép được thực hiện thông qua bộ nhớ đệm của màn hình. Bộ hiển thị HGML sẽ đảm trách việc này. Chức năng này cũng giúp tối ưu hóa việc lưu trữ các ảnh chủ đề. Ví dụ, thay vì phải lưu trữ bốn ký hiệu mũi tên (sang trái, sang phải, lên, xuống), người sử dụng chỉ cần lưu trữ một ảnh đơn trong cơ sở dữ liệu. Sau đó dùng các thẻ lệnh ROTATE (phép xoay) và FLIP (di chuyển) để canh chỉnh chúng lại đúng vị trí. Ví dụ: COPY Sao chép một phân đoạn màn hình (dạng hình chữ nhật) vào bộ nhớ đệm. Ảnh sau khi sao chép hoàn toàn giống với ảnh gốc. 184
  6. P h ụ lụ c A So sánh việc truyền tải đồ họa theo chuẩn HTML với truyền tải đồ họa theo chuẩn HGML HTML HGML Tập tin HTML - 5KB Tập tin HTML - 2KB Thông số của tập tin Ảnh GIF - 83KB Tập tin HGML - 13KB Thời gian truyền tải (qua 1 minute 13 giây 18 giây mạng GSM)* (Nguồn: www.w3.org/TR/NOTE-HGML.htm) Chú thích: * bao gồm thời gian truyền và hiển thị/ vẽ toàn bộ trang. Tốc độ vẽ là 9600 bps (bits per second). Ưu điểm của HGML HGML, khi so sánh với các sử dụng đồ họa nội tuyến trong HTML, có các ưu điểm chính như sau: • Tối ưu hóa hiệu suất cho mạng không dây. • Cửa sổ trình duyệt được xem như là một phông nền, cho phép phủ các lớp thành phần hình ảnh và định vị tuyệt đối trên trang (nghĩa là hình ảnh sẽ xuất hiện với “mối quan hệ chặt chẽ giữa các thành phần trong nó” khi thể hiện ở bất kỳ kích thước nào; đồng thời ảnh được phép cuộn, nếu cần thiết, bên trong một cửa sổ trình duyệt tùy ý ). • Cung cấp các ảnh được định nghĩa sẵn nhằm giúp việc xây dựng trang được đơn giản. • Có thể được nhúng vào trong HTML hoặc được sử dụng độc lập. (Nguồn: www.w3.org/TR/NOTE-HGML.htm) 5. DrawML Các thành phần trong ngôn ngữ DrawML: DrawML là một ngôn ngữ đơn giản. Nó chỉ định nghĩa năm thành phần. 185
  7. P h ụ lụ c A • Thành phần ‘drawml’: Một ảnh vẽ được thông báo đến một tài liệu bằng thành phần này. • Thành phần ‘shape’: một thành phần tổng quát chứa các thuộc tính của nó bằng một lớp Java. • Thành phần ‘line’: vẽ một đường thẳng giữa hai hoặc nhiều vị trí. • Thành phần ‘pos’: định nghĩa một vị trí trong một đường thẳng. • Thành phần ‘lmward’ (viết ngược lại của ‘drawml’): thành phần chuyển đổi ngữ cảnh ngược lại vào các thành phần DTD cha. Các khái niệm trong DrawML: Trong DrawML có các khái niệm sau: • Nhúng • Chỉnh kích thước tự động • Định vị trí tự động • Kết nối tự động Sau đây là mô tả chi tiết cho từng khái niệm trên: • Nhúng Một ảnh DrawML được nhúng trong tài liệu SGML/XML. Trong DrawML, người dùng có thể chèn các đoạn, các danh sách, hình ảnh, bảng biểu. • Chỉnh kích thước tự động DrawML có chức năng tự động chỉnh kích thước ảnh vẽ sao cho vừa khớp với nội dung bên trong nó. Ví dụ: This is my text 186
  8. P h ụ lụ c A Đoạn mã này cho hình sau: Kích thước ban đầu của Kích thước hình chữ nhật sau hình chữ nhật (ứng với được thay đổi tự động (để chứa width=100) được đoạn văn bản) • Định vị trí tự động Bằng cách đặt các vật thể hình học bên trong các vật thể hình học khác, DrawML có thể sắp thề sắp xếp và gom nhóm một cách thông minh. Vật thể hình học cha có thể ẩn và do đó được sử dụng cho mục đích duy nhất là gom nhóm. Theo mặc định, các vật thể hình học được sắp xếp theo chiều ngang. Ví dụ: Hello new World 187
  9. P h ụ lụ c A Đoạn mã này cho hình sau: • Kết nối tự động Các đối tượng trong DrawML có thể kết nối với nhau, chẳng hạn như các đối tượng trong một cây phân cấp sau: Tất cả các đối tượng trong DrawML đều được biểu diễn bằng Java. Việc sử dụng sức mạnh của ngôn ngữ lập trình hướng đối tượng như Java mang lại cho nhà phát triển khả năng linh động. Mỗi đối tượng được xem là một thể hiện của một lớp. Việc hiển thị các đối tượng chính là một lời gọi đến phương thức hiển thị của đối tượng đó. 188
  10. P h ụ lụ c A Ví dụ: public void DrawShape() { Painter.NewPath(); // Clear painter Painter.MoveTo( 0, 10 ); Painter.LineTo( MyW()/2, 0 ); Painter.LineTo( MyW(), 10 ); Painter.ClosePath(); Painter.Stroke(); // Draw roof Painter.NewPath(); Painter.MoveTo( 7, 10 ); Painter.LineTo( MyW() - 7, 10 ); Painter.LineTo( MyW() - 7, MyH() ); Painter.LineTo( 7, MyH() ); Painter.ClosePath(); Painter Stroke(); // Draw front Đoạn mã này biểu diễn hình sau: 189
  11. P h ụ lụ c B P hụ l ụ c B Kết quả cài đặt Để chạy được server phát sinh bản đồ cần: cài đặt jdk1.4.2, cài đặt Geoserver1.3 và thêm dữ liệu bản đồ thành phố vào Geoserver, cài đặt MySQL và thêm dữ liệu đường đi, cài đặt SQL server và thêm dữ liệu tên đường vào vì hiện tại server phát sinh bản đồ SVG dựa vào: tài liệu GML trả về từ Geoserver mà Geoserver lại sử dụng dữ liệu đường đi từ MySQL server, và kết hợp với dữ liệu tên đường đi từ SQL server. Chép tòan bộ chương trình GenerateSVGMap vào Inetpub\wwwroot\ sau đó trên trình duyệt gõ câu truy vấn sau vào textbox nhập URL: http://localhost/GenerateSVGMap/BanDoPhatSinh.aspx?serveraddress=http://l ocalhost:8080/geoserver/wfs?&bbox=16.829529,0,13184.242787,10755.848151&fi lterproperty=&layers=topp:Truongcap3,topp:benhvien3,topp:mapnetwoarc_auto&m axfeatures=&version=&crs=&method=&format=GML2&width=700&height=571.0 7& Bản đồ phát sinh sẽ như sau: 190
  12. P h ụ lụ c B Hình B1. Bản đồ SVG được phát sinh bởi GenerateSVGMap Để chạy client cần chép toàn bộ thư mục UngDung_Client vào Inetpub\wwwroot\ sau đó mở tập tinh index.html. Màn hình ứng dụng: 191
  13. P h ụ lụ c B Hình B2. Bản đồ SVG được hiển thị trong chương trình client Muốn phóng to hay thu nhỏ tạm thởi dùng các khả năng của Adobe SVG Viewer 6.0. Rê chuột vào các đối tượng để xem chú thích thông tin chi tiết của đối tượng đó. 192
  14. P h ụ lụ c B Hình B3. Minh hoạ chú thích khi rê chuột lên một đối tượng 193
  15. Tài liệu tham khảo Tài liệu tham khảo 1. Chung Hiếu Nghĩa, Nguyễn Ngọc Thuận, Luận văn cử nhân tin học - Xây dựng hệ tra cứu thông tin bản đồ trên web, 2001. 2. Nhóm tác giả Elicom, Ngôn ngữ HTML 4 cho World Wide Web, NXB Hà Nội, 2000. 3. Phạm Hữu Khang, Xây dựng và triển khai ứng dụng thương mại điện tử, Tập 2, NXB Thống Kê, 2003. 4. Dương Anh Đức, “Thuật toán Dijkstra”, Giáo trình Lý thuyết đồ thị, tr.38-42, 2004. 5. Dương Anh Đức và Lê Đình Duy, “Các phép biến đổi trong đồ họa hai chiều”, Bài giảng đồ họa máy tính, tr.63-79, 2002. 6. ESRI Shapefile Technical Description, 1998. 7. http://www.w3.org/TR/2003/REC-SVG11-20030114/ 8. http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113 9. www.kevlindev.com 10. www.learnsvg.com 11. www.w3school.com 12. www.carto.net 13. www.inkscape.org
ADSENSE

CÓ THỂ BẠN MUỐN DOWNLOAD

THÔNG TIN
TRỢ GIÚP
HỖ TRỢ KHÁCH HÀNG
Theo dõi chúng tôi

Chịu trách nhiệm nội dung:

Nguyễn Công Hà - Giám đốc Công ty TNHH TÀI LIỆU TRỰC TUYẾN VI NA

LIÊN HỆ

Địa chỉ: P402, 54A Nơ Trang Long, Phường 14, Q.Bình Thạnh, TP.HCM

Hotline: 093 303 0098

Email: support@tailieu.vn

Giấy phép Mạng Xã Hội số: 670/GP-BTTTT cấp ngày 30/11/2015 Copyright © 2022-2032 TaiLieu.VN. All rights reserved.

 

Đồng bộ tài khoản
2=>2