Đang chuẩn bị liên kết để tải về tài liệu:
TÌM HIỂU SVG VÀ ỨNG DỤNG - 7

Chương 3. Cấu trúc định dạng tập tin SVG Kết quả trên trình duyệt: ảnh “a.png” bị làm mờ đi do thuộc tính ‘fill-opacity = 0.3’, ảnh “a.png” thứ hai chỉ hiển thị phần trong của đường xén hình chữ nhật clipRecorte: Hình 3.27 Minh họa thành phần ‘clipPath’ 120 Chương 3. Cấu trúc định dạng tập tin SVG 3.15 Thành phần ‘path’ 3.15.1 | Chương 3. Cấu trúc định dạng tập tin SVG xml version 1.0 DOCTYPE svg PUBLIC - W3C DTD SVG 1.0 EN http www.w3.org TR 2001 REC-SVG-20010904 DTD sVg10.dtd svg width 236 height 295 defs clipPath id clipRecorte path d M0 0 L100 0 L100 100 L0 100 Z clipPath defs image width 236 height 295 xlink href a.gif opacity 0.3 image width 236 height 295 xlink href a.png clip-path url clipRecorte rect id filtered width 100 height 100 style fill red fill-opacity 0 stroke red stroke-width 1 shape-rendering optimizeSpeed svg Kết quả trên trình duyệt ảnh a.png bị làm mờ đi do thuộc tính fill-opacity 0.3 ảnh a.png thứ hai chỉ hiển thị phần trong của đường xén hình chữ nhật clipRecorte Hình 3.27 Minh họa thành phần clipPath 120 Chương 3. Cấu trúc định dạng tập tin SVG 3.15 Thành phần path 3.15.1 Giới thiệu Path đường có thể là đường viền của một hình tô màu được hoặc là màu viền hoặc là đường xén hoặc là kết hợp của các tính nâng này. Một đường được mô tả bằng cách dùng khái niệm toạ độ hiện tại . Chẳng hạn khi vẽ trên giấy toạ độ hiện tại được hiểu là vị trí của cây viết. Vị trí của viết có thể thay đổi và đường viền của hình là đường mơ hoặc đóng sẽ được vẽ bằng cách rê bút theo đường cong hay đường thẳng từ toạ độ hiện tại . Đường là viền ngoài cua một đối tượng được định nghĩa bằng các thuật ngữ moveto thiết lập vị trí hiện tại mới lineto vẽ một đường thẳng curveto vẽ một đường cong Bézier arc vẽ cung tròn hay cung e-líp và closepath vẽ ngược lại điểm ban đầu . Đường phức là một đường gồm nhiều đường con. 3.15.2 Thành phần path Một số thuộc tính của thành phần path d path data Định nghĩa đường viền của hình. pathLength number Độ dài ước lượng của đường được người hoặc công cụ tạo ra nó tính toán. 3.15.3 Dữ liệu đường path data Thành phần path chứa một thuộc tính d path data . Thuộc tính d chứa các chỉ thị moveto line curve closepath và các toạ độ trong hệ trục toạ độ người dùng hiện tại. 121 Chương 3. Cấu trúc định dạng tập tin SVG Ví dụ 1 Ví dụ sau xây dựng một đường là hình tam .