3.6.1 Tổng quan:
SVG mở rộng khả năng dùng các tham chiếu URI tới các đối tượng khác. Ví dụ, để tơ một hình chữ nhật với màu tuyến tính, thì trước tiên chúng ta cần định nghĩa một thành phần 'linearGradient' và gán cho nĩ một ID như sau:
54
<linearGradient id="MyGradient">...</linearGradient>
Sau đĩ trong thành phần ‘rect’ chúng ta cĩ thể dùng thuộc tính ‘fill’ tham chiếu tới thành phần ‘linearGradient’ trên như sau:
<rect style="fill:url(#MyGradient)"/>
Tham chiếu URI được định nghĩa theo các dạng sau:
<URI-reference> = [ <absoluteURI> | <relativeURI> ] [ "#" <elementID> ] -hay-
<URI-reference> = [ <absoluteURI> | <relativeURI> ] [ "#xpointer(id(" <elementID> "))" ]
<elementID> là định danh của thành phần được tham chiếu <absoluteURI> là URI tuyệt đối
<relativeURI> là URI tương đối
#<elementID> và #xpointer(id(<elementID>)) là các phát biểu theo cú pháp tương thích với ngơn ngữ con trỏ XML (XML Pointer Language - XPointer).
SVG hỗ trợ hai kiểu tham chiếu URI:
• Tham chiếu URI cục bộ (local URI references), khi đĩ tham chiếu URI khơng chứa <absoluteURI> hay <relativeURI> và do đĩ chỉ chứa
định danh của phân đoạn được tham chiếu là #elementID hay #xpointer(id<elementID>).
• Tham chiếu URI khơng cục bộ (non-local URI references), khi đĩ tham chiếu URI chứa hoặc <absoluteURI> hoặc <relativeURI>
Sau đây là các nguyên tắc xử lý của tham chiếu URI:
• Các tham chiếu URI tới các nút (node) khơng tồn tại sẽ xem như một tham chiếu khơng hợp lệ.
• Các tham chiếu URI tới các thành phần khơng đúng với tham chiếu
được cho cũng sẽđược xem như một tham chiếu khơng hợp lệ, ví dụ
thuộc tính ‘clip-path’ chỉ cĩ thể tham chiếu tới thành phần ‘clipPath’. Thiết lập thuộc tính clip-path:url(#MyElement) là một tham chiếu
55
khơng hợp lệ nếu thành phần được tham chiếu (MyElement) khơng phải là ‘clipPath’.
• Tham chiếu URI tham chiếu trực tiếp hay gian tiếp ngược trở lại nĩ là một tham chiếu vịng khơng hợp lệ.
Như vậy SVG cĩ các thành phần và thuộc tính cho phép tham chiếu và cũng cĩ các thanh phần và thuộc tính khơng cho phép tham chiếu. Đối với các thành phần được tham chiếu thì sẽ cĩ thành phần được tham chiếu là hợp lệ cho tham chiếu này nhưng khơng hợp lệ cho tham chiếu khác tới nĩ. Sau đây sẽ là phần liệt kê mơ tả một số thành phần và thuộc tính cho phép tham chiếu và các đích tham chiếu hợp lệ cho các tham chiếu đĩ:
• Thành phần ‘a’ cĩ thể tham chiếu tới bất kỳ nguồn tài nguyên cục bộ
hay khơng cục bộ nào đĩ.
• Thành phần ‘altGlyph’ phải tham chiếu tới thành phần ‘altGlyphDef’ hay một thành phần ‘glyph’.
• Thành phần ‘animate’ (xin vui lịng xem phần mơ tả chi tiết thành phần ‘animate’ trong đặc tả SVG của W3C).
• Thành phần ‘animateColor’ (xin vui lịng xem phần mơ tả chi tiết thành phần ‘animate’ trong đặc tả SVG của W3C).
• Thành phần ‘animateTransform’ (xin vui lịng xem phần mơ tả chi tiết thành phần ‘animate’ trong đặc tả SVG của W3C).
• Thuộc tính ‘clip-path’ phải tham chiếu tới một thành phần ‘clipPath’.
• Thuộc tính ‘cursor’ phải tham chiếu tới một nguồn tài nguyên cung cấp một hình ảnh cho con trỏ chuột.
• Thành phần ‘felImage’ phải tham chiếu tới nguồn tài ngyên cục bộ
hay khơng cục bộ.
• Thuộc tính ‘fill’ tham chiêu tới một thành phần ‘linearGradient’….
• Thành phần ‘filter’ phải tham chiếu tới một thành phần ‘filter’.
56
• Thành phần ‘image’ phải tham chiếu một nguồn tài nguyên cục bộ
hay khơng cục bộ.
• Thành phần ‘linearGradient’ phải tham chiếu tới một thành phần ‘linearGradient’ hay ‘radialGradient’.
• Thuộc tính ‘marker’, ‘marker-start’, ‘marker-mid’ và ‘marker-end’ phải tham chiếu tới một thành phần ‘marker’.
• Thuộc tính ‘mask’ phải tham chiếu tới một thành phần ‘mask’.
• Thành phần ‘pattern’ phải tham chiếu tới một thành phần ‘linearGradient’ hay thành phần ‘radialGradient’.
• Thành phần ‘script’ phải tham chiếu tới nguồn tài nguyên bên ngồi cung cấp nội dung script.
• Thuộc tính ‘stroke’ tham chiếu tới một màu nào hay thành phần màu nào đĩ như ‘linearGradient’ chẳng hạn.
• Thành phần textpath phải tham chiếu tới một thành phần ‘path’.
• Thành phần ‘tref’ cĩ thể tham chiếu tới bất kỳ thành phần SVG nào.
• Thành phần ‘set’ sẽ được nhắc đến trong phần mơ tả chi tiết thành phần ‘animate’.
• Thành phần ‘use’ cĩ thể tham chiếu tới bất kỳ nguồn tài nguyên cục bộ hay khơng cục bộ nào.
Sau đây là các quy tắc dùng xử lý các tham chiếu URI khơng hợp lệ:
• Một tham chiếu URI cục bộ khơng hợp lệ (nghĩa là một tham chiếu tới một nút trong tài liệu hiện tại) sẽ phát sinh một lỗi, ngoại trừ thuộc tính xlink:href trong thành phần ‘a’ và thuộc tính cho phép dữ liệu phịng hờ trường hợp giá trị tham chiếu URI khơng hợp lệ.
• Một tham chiếu vịng khơng hơp lệ sẽ phát sinh một lỗi.
• Khi thuộc tính externalResourcesRequired được thiết lập là ‘true’ trong thành phần đang tham chiếu hay là một trong các thành phần cha của nĩ thì một tham chiều URI ngoại khơng được đáp lại sẽ phát
57
sinh một lỗi (ví dụ , trường hợp một nguồn tài nguyên khơng thểđịnh vịđược).
Như vậy để tránh việc tham chiếu ngoại dễ phát sinh lỗi thì bất kỳ khi nào cĩ thể chúng ta nên định nghĩa các thành phần được tham chiếu bên trong thành phần ‘defs’. Cụ thể là các thành phần thường được tham chiếu như: 'altGlyphDef', 'clipPath', 'cursor', 'filter', 'linearGradient', 'marker', 'mask', 'pattern', 'radialGradient' và 'symbol'. Định nghĩa các thành phần này trong thành phần ‘defs’ làm cho nội dung SVG dễ hiểu và tăng khả năng truy xuất hơn đặt chúng trong một tài liệu bên ngồi khác.