SVG

SVG (Scalable Vector Graphics), una raccomandazione del W3C, è un linguaggio per la descrizione di grafica bidimensionale in XML. SVG prevede tre tipi di oggetti grafici: forme grafiche vettoriali (ad esempio percorsi costituiti da rette e curve), immagini e testo. Gli oggetti grafici (compreso il testo) possono essere raggruppati, elaborati, trasformati e combinati in oggetti di cui è stato precedentemente eseguito il rendering. L'insieme di funzionalità SVG include trasformazioni nidificate, tracciati di ritaglio, maschere alfa e oggetti modello.

I disegni SVG possono essere interattivi e dinamici. Ad esempio, è possibile definire e attivare animazioni mediante l'uso di script.

È possibile realizzare applicazioni di SVG sofisticate usando gli script, che accedono al DOM (Document Object Model) SVG e offrono accesso completo a tutti gli elementi, attributi e proprietà. A ogni oggetto grafico SVG può essere assegnato un ricco insieme di gestori eventi, ad esempio 'onmouseover' e 'onclick'.

Grazie alla compatibilità di SVG e alla sua capacità di sfruttare altri standard Web è possibile utilizzare funzionalità come lo scripting su elementi XHTML e SVG contemporaneamente nella stessa pagina Web.

L'elenco di argomenti seguente, che si amplierà col tempo, presenta le principali funzionalità di SVG.

Contenuto della sezione

ArgomentoDescrizione

Trasformazioni delle coordinate SVG

In questo argomento vengono illustrate le trasformazioni delle coordinate SVG associate al metodo getScreenCTM().

Animazione SVG di base

Questo argomento tratta dell'animazione SVG di base e costituisce un prerequisito per l'argomento intitolato Animazione SVG di livello intermedio. Si presuppone una conoscenza di base di HTML e JavaScript. Per comprendere appieno il materiale presentato in questo argomento è necessario dedicarvi un'ora del proprio tempo.

Animazione SVG di livello intermedio

In questo argomento vengono presentate le tecniche di animazione SVG di livello intermedio riprendendo dal punto in cui si interrompe l'argomento Animazione SVG di base. Per comprendere a pieno i concetti presentati in questo argomento, occorre circa un'ora di studio.

Animazione SVG avanzata

Questo argomento prende in esame concetti più avanzati relativi alla creazione di animazioni SVG per un sito Web. Prima di procedere con questa esercitazione, occorrono dimestichezza con i concetti illustrati in Animazione SVG di base e Animazione SVG di livello intermedio e una valida conoscenza di HTML e JavaScript.

Aggiunta di SVG a una pagina Web

Questo argomento illustra alcuni modi comuni per eseguire il rendering di SVG nelle pagine Web e presuppone una conoscenza di base di HTML e JavaScript.

Come eseguire zoom e panoramica con SVG

In questo argomento viene illustrato come usare la grafica Scalable Vector Graphics (SVG) per eseguire operazioni di zoom e scorrimento. L'argomento si conclude con un esempio di organigramma complesso su cui è possibile eseguire operazioni di zoom e scorrimento. Ai fini di questo argomento si presuppongono conoscenze di base di HTML e JavaScript, nonché accesso a un browser in grado di eseguire il rendering in linea di SVG in HTML5, ad esempio Windows Internet Explorer 9 e successivi.

 

Argomenti correlati

Esempi ed esercitazioni per Internet Explorer 9

 

 

Mostra:
© 2015 Microsoft