January 17
SVG sta per Scalable Vector Graphics. La maggior parte dei moderni browser web supportano SVG. SVG è utilizzata, come suggerisce il nome, per creare la grafica per la visualizzazione sul web. SVG è uno standard web riconosciuto e sostenuto dal World Wide Web Consortium (W3C). Le seguenti operazioni coprire le basi.
1 SVG utilizza il linguaggio di markup XML per definire la grafica vettoriale basata sul web. La grafica è XML puri, non sono le immagini, nel senso che si può essere utilizzato per con le immagini JPEG o GIF. In altre parole, è possibile creare immagini SVG con niente di più complicato di Blocco note e un po 'di XML.
2 A causa della parte scalabile di SVG, i grafici possono essere ridotte o ingrandite e non perdere mai nessuna delle loro qualità.
3 Poiché le immagini SVG sono definite con XML, ogni elemento del grafico può essere identificato in XML e animato. A prima vista, potrebbe non essere in grado di dire una animazione SVG da un'animazione Flash. La differenza è che SVG è una tecnologia open source che utilizza standard accettati come il Document Object Model (DOM) per manipolare l'immagine.
4 
Ecco un esempio. Farò una grafica di un cerchio. L'immagine mostra un piccolo file in formato SVG, salvato come circle.svg. Il DOCTYPE è un SVG DTD. Il cerchio ha un raggio di 40px, un colpo rosso 3px e un riempimento blu. Questo è XML, in modo che tutti i tag devono essere chiusi.
5 
In un browser compatibile con SVG, ecco come che sembra.
6 Il cx è l'asse x del cerchio, il cy è l'asse y del cerchio. Con un cerchio, si può effettivamente omettere questi due e semplicemente utilizzare la R, che è il raggio. (Con un ellisse, si avrebbe bisogno la xe y.) Riempire, ictus e ictus-width sono auto-esplicativi.
7 Le forme sono rect (rettangolo), cerchi, ellissi, linee, polilinee, e poligoni.
8 Il grafico definito nel file SVG viene inserito in un file HTML o con un tag embed (deprecato) e tag object o in un iframe. Basta puntare al file SVG per l'origine dell'oggetto.
9
Un tag percorso viene utilizzato per animare un oggetto. Il percorso nell'immagine sposta l'oggetto da un punto di partenza per diverse posizioni e quindi chiude il percorso. Qui si comanda il percorso possibile: M = moveto, L = lineTo, H = lineTo orizzontale, V = verticale, C = curveTo, S = curveTo liscia, Q = quadratica curva Belzier, T = liscia quadratica curveTo Belzier, A = arco ellittico e Z = closePath.