Vector Markup Language: differenze tra le versioni
Contenuto cancellato Contenuto aggiunto
m Bot: inserimento portale (via JWB) |
|||
| (37 versioni intermedie di 19 utenti non mostrate) | |||
Riga 1:
[[File:VMLJoconde.jpg|thumb
▲[[File:VMLJoconde.jpg|thumb|right|Ritratto sviluppato con codice VML: [http://www.svg-vml.net/Joconde.htm La Gioconda in VML (33Kb)]]]
'''Vector Markup Language''' (VML) è un linguaggio [[Extensible Markup Language|XML]] aperto, destinato alla creazione di [[grafica vettoriale]] elaborate in 2D o 3D (statiche o animate) sulle pagine Web.
== Storica ==
VML
VML è introdotto in [[Internet Explorer]], [[Microsoft Office]] e [[Silverlight]]. Fa parte della specificazione OOXML, dove viene definito in complemento di DrawingML.
Riga 10 ⟶ 9:
== Utilizzo del formato sul Web ==
Il linguaggio VML può integrarsi sia direttamente nel codice [[HTML]], sia tramite l'elemento <code>v:vmlframe</code> legato ad un o più file XML. Questo elemento permette di sistemare le immagini vettoriali in modo analogo alle immagini bitmap. L'uso degli attributi <code>width</code> e <code>height</code> permette d'ingrandire o di ridurre le immagini senza perdita di qualità. È possibile applicare numerosi effetti di filtro sulle immagini che possono essere ugualmente messe nel sotto-elemento <code>v:fill</code> e prendere effetto degli attributi di colore e digradati, con utilizzo del [[canale alpha]] per la [[trasparenza]]. Esistono tre tipi di digradati da VML: gradient (lineare),
gradientRadial e gradientTitle (con focus variabile). L'extrusion 3D permette la messa in rilievo di ogni elemento VML: gli effetti di luce apportando profondità e realismo alle grafica.
VML è un linguaggio che permette realizzazioni complesse su file di formato [[XML]]. VML è maneggiabile con [[JavaScript]] o [[JScript]] e più comodamente con HTML + TIME per le animazioni.
[[Google Maps]] utilizza attualmente VML per il reso vettoriale con Internet Explorer, e SVG per i navigatori che lo
== Esempi di codice ==
[[Image:Ovale.gif|thumb
Il codice VML seguente integrato nel codice HTML mostra una semplice [http://www.svg-vml.net/oval.htm ellisse] {{Webarchive|url=https://web.archive.org/web/20091212050602/http://www.svg-vml.net/oval.htm# |data=12 dicembre 2009 }}:
<
<html xmlns:v>
<style>v\:*{behavior:url(#default#VML);position:absolute}</style>
Riga 26 ⟶ 25:
</body>
</html>
</syntaxhighlight>
----
Le regole CSS sono utilizzate per i posizionamenti, la [[formattazione del testo]], le dimensioni e i filtri quando essi possono essere applicati.
La creazione di oggetti “modello” e la loro duplicazione si effettua tramite l'elemento <code>v:shapetype</code> per ogni forma vettoriale, e l'elemento <code>v:vmlframe</code> per i gruppi di oggetti vettoriali.
Qui sotto: Esempio più complesso di combinazioni di elementi ed attributi propri a VML dentro il codice HTML.<br>▼
Una <span style="color:red">'''forma'''</span> definita da un file XML esterna è introdotta da l'elemento vmlframe su il quale un filtro e applicato. <br>▼
▲Qui sotto: Esempio più complesso di combinazioni di elementi ed attributi propri a VML dentro il codice HTML.
Ogni forma discendente di questa ultima può anche prendere i suoi propri attributi distinti del modello. L'<span style="color:#9F3300">''' insieme'''</span> raggruppato da l'elemento '''v:group''' viene a suo tempo riprodotto da una nuova "<span style="color:fuchsia">'''vmlframe'''</span>".<br>▼
▲Una
Queste proprietà permettono delle composizioni vettoriali molto ricche utilizzando poche scritture.<br>▼
Altre forme periferiche sono calcate su una shapetype.
<table border=1 style="background-color:#A1C1CF;font-size:12px;width:690px">▼
▲Ogni forma discendente di questa ultima può anche prendere i suoi propri attributi distinti del modello. L'
[[Image:VMLfireball.jpg|306px|thumb|right|Illustrazione di esempi: [http://www.web-vector-image.net/fireball.htm VML COLORED FIREBALL]]]▼
▲Queste proprietà permettono delle composizioni vettoriali molto ricche utilizzando poche scritture.
|-
|
▲[[Image:VMLfireball.jpg|
<span style="background-color:aqua">''' File HTML '''</span>
<<span style="color:#9933A3">'''html'''</span> xmlns:v>
<<span style="color:#9933A3">'''style'''</span>><br>▼
v\:
v\:
<<span style="color:#9933A3">'''
<<span style="color:#9933A3">'''h1'''</span>>VML
COLORED FIREBALL<<span style="color:#9933A3">'''/h1'''</span>>
<<span style="color:red">'''v'''</span>''':shapetype id='''"<span style="color:green">'''arw</span>'''"''' path='''"▼
<<span style="color:
<'''
<'''<span style="color:red">
<'''<span style="color:red">v</span>:vmlframe src="<span style="color:#414141">ball.xml</span><span style="color:red">#ball</span>" clip='''"<span style="color:blue">t</span>" '''size='''"<span style="color:blue">32,32</span>"<br />
'''style='''"<span style="color:blue">top:55;width:580;height:550;background-color:white;filter:blur(Add=1,Strength=140)</span>"/>
<br />
<br />
<'''<span style="color:red">
'''style='''"<span style="color:blue">left:80;top:25</span>">
<br />
<br />
<'''<span style="color:red">
'''fillcolor='''"<span style="color:blue">aqua</
<'''
<'''
'''style='''"<span style="color:blue">left:-1900;top:1430;width:5000;height:4000;rotation:50</span>"/>
<br />
<br />
<'''<span style="color:red">
▲<'''<span style="color:red">
<span style="color:blue">left:390;top:140;width:200;height:150</span>"/>
<br />
<br />
<<span style="color:#9933A3">'''/body'''</span>><br />
<<span style="color:#9933A3">'''/html'''</span>>
|}
|-
|
▲<table border=1 style="background-color:#A3C7A2;font-size:12px;width:690px">
<span style="background-color:lime">''' File XML esterna: "<span style="color:#414141">ball.xml</span>" '''</span>
<br /><br />
<span style="color:#9933A3"><xml <
<v:group <span style="color:maroon">id="</span><span style="color:red">'''ball'''</span>" style="<span style="color:blue">width:2000;height:2000</span>">
<br />
<br />
<v:shape <span style="color:maroon">style</span>="<span style="color:blue">left:4;top:1</span>"
<span style="color:maroon">path</span>="<span style="color:blue">m9,1l9,r1,2l11,1r,2l12,2v,4,,7,-7,6l6,7,4,6r1,c6,6,6,5,3,4r1,l,2r3,l2,1r3,l4,xnse</span>">
<br />
<v:fill <span style="color:maroon">color</span>="<span style="color:blue">red</span>"
<span style="color:maroon">color2</span>="<span style="color:blue">yellow</span>"
<span style="color:maroon">focusposition</span>="<span style="color:blue">.99,.8</span>"
<span style="color:maroon">focussize</span>="<span style="color:blue">.01,.01</span>"
<span style="color:maroon">type</span>="<span style="color:blue">gradientTitle</span>"/><br />
<v:shadow
<span style="color:maroon">on</span>="<span style="color:blue">t</span>"
Riga 109 ⟶ 116:
<span style="color:maroon">opacity</span>="<span style="color:blue">.4</span>"
<span style="color:maroon">offset</span>="<span style="color:blue">-1pt,-.5pt</span>"
<span style="color:maroon">offset2</span>="<span style="color:blue">-2pt</span>"/><br />
</v:shape><br />
</v:group><br />
<br />
</xml>
|}
== Editori e logistica ==
Microsoft Office permette di pubblicare grafica VML senza tuttavia utilizzare integralmente i DOM di VML.<br />
[[
delle grafica convertite in VML.
==Altri progetti==
{{interprogetto}}
==Collegamenti esterni==
=== Rapporto e dimostrazioni ===
*{{en}} [http://www.svg-vml.net/ Paragone VML/SVG] {{
*{{
*{{
*{{
*{{
=== Tutori, didattici ===
*{{
*{{
{{Portale|informatica}}
[[Categoria:XML]]▼
▲[[Categoria:Linguaggi di markup XML]]
| |||