Rectangles #2

I 2 rettangoli in basso hanno gli stessi attributi dei primi due ma hanno subito una traslazione e una scalatura

Rectangles #1

I 3 rettangoli hanno gli stessi attributi x=50, y=50, coordinate del centro width=200, height=100, dimensioni ma il secondo ha rx=25, ry=25 e il terzo subisce una traslazione e una rotazione

Circles #1

L’esempio introduttivo proposto dal Mozilla SVG Project. Tre cerchi con riempimento semitrasparente, fill-opacity=”…”, di colore diverso, fill=”…”, posizionati tramite transform=”translate(…, …)

Line #1

Le linee possono avere diversi stili, stroke-linecap, per le estremità butt round square

Ellipse #1

Le tre ellissi hanno gli stessi attributi cx=150, cy=100, coordinate del centro rx=100, raggio orizzontale ma la seconda ha ry=25, raggio verticale e la terza subisce una traslazione e una rotazione

Riepilogo path

Da revisionare Estremi M x,y indica il nuovo punto da cui partire Z x,y collega l’ultimo punto al primo Linee L x,y linea verso il punto successivo H x nuova coordinata orizzontale V y nuova coordinata verticale Bezier cubica C x1,y1 x2,y2 x,y dal punto attuale, utilizzando x1,y1 come punto di controllo, a x,y utilizzando … Leggi tutto

Raggruppamenti

Quando diversi elementi condividono degli attributi è possibile dichiararli una volta per tutti. L’elemento g si comporta come un raccoglitore/aggregatore di altri elementi. Gli attributi di g diventano attributi di tutti gli elementi figli. … … … Le due figure condividono il bordo blu di spessore 5 e l’interno giallo Raggruppamenti annidati Si possono annidare … Leggi tutto

Forme elementari #3

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). Il colore di riempimento, fill, di default è nero, quindi è necessario escluderlo con fill:none. Un tratto blu, di spessore … Leggi tutto

Definizioni #1

L’elemento defs è un contenitore di elementi con un nome. Il nome viene assegnato come attributo id id=”nome” Gli elementi dichiarati all’interno di defs potranno essere richiamati tramite il loro nome… Esempio Definizione di due elementi un cerchio grande, blu un cerchio piccolo, rosso e successivo utilizzo… cerchio blu cerchio rosso sovrapposto cerchio blu traslato … Leggi tutto