SVG <đa giác>
Đa giác SVG - <đa giác>
Phần tử <polygon> được sử dụng để tạo một đồ họa có ít nhất ba cạnh.
Đa giác được tạo bởi các đường thẳng, và hình dạng là "đóng" (tất cả các đường nối lên).
Polygon xuất phát từ tiếng Hy Lạp. "Poly" có nghĩa là "nhiều" và "gon" có nghĩa là "góc".
ví dụ 1
Ví dụ sau tạo một đa giác có ba cạnh:
Đây là mã SVG:
Thí dụ
<svg height="210" width="500">
<polygon points="200,10 250,190 160,210"
style="fill:lime;stroke:purple;stroke-width:1" />
</svg>
Giải thích mã:
- Thuộc tính điểm xác định tọa độ x và y cho mỗi góc của đa giác
Ví dụ 2
Ví dụ sau tạo một đa giác có bốn cạnh:
Đây là mã SVG:
Thí dụ
<svg height="250" width="500">
<polygon points="220,10 300,210 170,250 123,234"
style="fill:lime;stroke:purple;stroke-width:1" />
</svg>
Ví dụ 3
Sử dụng phần tử <polygon> để tạo một ngôi sao:
Đây là mã SVG:
Thí dụ
<svg height="210" width="500">
<polygon points="100,10 40,198 190,78 10,78 160,198"
style="fill:lime;stroke:purple;stroke-width:5;fill-rule:nonzero;" />
</svg>
Ví dụ 4
Thay đổi thuộc tính quy tắc điền thành "evenodd":
Đây là mã SVG:
Thí dụ
<svg height="210" width="500">
<polygon points="100,10 40,198 190,78 10,78 160,198"
style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />
</svg>