Polilinea
Un elemento polyline è utilizzato per disegnare una line spezzata.
La spezzata è descritta dall’attributo d che contiene una sequenza di punti da collegare.
Ogni punto è descritto da una coppia x, y (ascissa,ordinata).
|
1 |
<polyline points = "..." /> |
Il colore di riempimento, fill, di default è nero, quindi è necessario escluderlo con fill:none.
Un tratto blu, di spessore 5, da (50,200) a (400,200)
|
1 |
<polyline points = "50,200 150,50 300,50 400,200" style = "stroke:blue; stroke-width:5; fill:none"/> |
Poligono
L’elemento polygon si utilizza come polyline ma in più l’ultimo punto della sequenza sarà collegato con il primo.
Con polyline sarebbe necessario ripetere il primo punto.
|
1 |
<polygone points = "..." /> |
Un poligono (un trapezio isoscele…) nero, con bordo blu di spessore 5, con i vertici in (50,100), (150,50), (300,50), (400,200)
|
1 |
<polygone points = "50,200 150,50 300,50 400,200" style = "stroke:blue; stroke-width:5"/> |
Tutte
Tutte le forme (cambiando opportunamente le posizioni)
|
1 2 3 4 5 6 |
<?xml version="1.0" ?> <svg xmlns="http://www.w3.org/2000/svg"> <polyline points="50,200 150,50 300,50 400,200" style="stroke:blue; stroke-width:5; fill:none"/> <polyline points="50,450 150,300 300,300 400,450" style="stroke:blue; stroke-width:5"/> <polygon points="50,700 150,550 300,550 400,700" style="stroke:blue; stroke-width:5"/> </svg> |