Linguagem de marcação vetorial - Vector Markup Language

Linguagem de marcação vetorial
Extensão de nome de arquivo .htm ou .html
Tipo de mídia da Internet
application / vnd.openxmlformats-officedocument.vmlDrawing
Desenvolvido por Microsoft
Tipo de formato Formato de imagem vetorial
Estendido de XML
Padrão Parte da ECMA-376 e ISO / IEC 29500: 2008
Local na rede Internet ECMA-376 , ISO / IEC 29500-4: 2012

Vector Markup Language ( VML ) é um formato de arquivo obsoleto baseado em XML para gráficos vetoriais bidimensionais . Ele foi especificado na Parte 4 dos padrões Office Open XML ISO / IEC 29500 e ECMA -376. De acordo com a especificação, VML é um formato obsoleto incluído no Office Open XML apenas por motivos de legado.

VML foi amplamente utilizado em documentos do MS Office 2007 Word, Excel e PowerPoint. Em 2012, com o lançamento do Internet Explorer 10 , o VML se tornou obsoleto e não é mais compatível com o modo padrão do Internet Explorer. É um recurso herdado que está disponível no Internet Explorer 10 apenas quando o navegador está configurado para ser executado em modos que emulam a funcionalidade das versões anteriores do Internet Explorer 6, 7, 8 e 9.

História

O VML foi submetido ao World Wide Web Consortium (W3C) em 1998 pela Autodesk , Hewlett-Packard , Macromedia , Microsoft e Vision . Na mesma época, outras inscrições concorrentes do W3C foram recebidas na área de gráficos vetoriais da Web, como Precision Graphics Markup Language (PGML) da Adobe Systems , Sun Microsystems e outras. Como resultado desses envios, um novo grupo de trabalho do W3C foi criado, o qual produziu Scalable Vector Graphics (SVG). SVG se tornou uma recomendação do W3C em 2001 como uma linguagem para descrever vetores bidimensionais e gráficos vetoriais / raster mistos em XML. O VML se tornou amplamente obsoleto em favor de outros formatos, como SVG. SVG não é compatível com VML.

O desenvolvimento do formato foi interrompido em 1998. VML é implementado no Internet Explorer da versão 5 à versão 9 e no Microsoft Office 2000 . O VML não está mais disponível no Internet Explorer 10 . A Microsoft espera que os sites façam a transição para SVG. A versão 2 da API JavaScript do Google Maps costumava usar VML para caminhos vetoriais no Internet Explorer 5.5+, mas foi oficialmente descontinuada em favor da versão 3, que não é.

Sintaxe

Abaixo está uma instância VML produzida pelo Microsoft Excel 2010:

<xml xmlns:v="urn:schemas-microsoft-com:vml"
 xmlns:o="urn:schemas-microsoft-com:office:office"
 xmlns:x="urn:schemas-microsoft-com:office:excel">
 <o:shapelayout v:ext="edit">
  <o:idmap v:ext="edit" data="1"/>
 </o:shapelayout><v:shapetype id="_x0000_t202" coordsize="21600,21600" o:spt="202"
  path="m,l,21600r21600,l21600,xe">
  <v:stroke joinstyle="miter"/>
  <v:path gradientshapeok="t" o:connecttype="rect"/>
 </v:shapetype><v:shape id="_x0000_s1025" type="#_x0000_t202" style='position:absolute;
  margin-left:203.25pt;margin-top:82.5pt;width:108pt;height:59.25pt;z-index:1;
  visibility:hidden' fillcolor="#ffffe1" o:insetmode="auto">
  <v:fill color2="#ffffe1"/>
  <v:shadow on="t" color="black" obscured="t"/>
  <v:path o:connecttype="none"/>
  <v:textbox style='mso-direction-alt:auto'>
   <div style='text-align:left'></div>
  </v:textbox>
  <x:ClientData ObjectType="Note">
   <x:MoveWithCells/>
   <x:SizeWithCells/>
   <x:Anchor>
    4, 15, 5, 10, 6, 31, 9, 9</x:Anchor>
   <x:AutoFill>False</x:AutoFill>
   <x:Row>6</x:Row>
   <x:Column>3</x:Column>
  </x:ClientData>
 </v:shape>
</xml>

Observe que, ao especificar um elemento raiz denominado "xml", o VML infringe a recomendação XML do W3C , que afirma que os nomes que começam com 'x' 'm' 'l' são "reservados para padronização nesta ou em futuras versões desta especificação" .

Oval VML no Internet Explorer
Exemplo de VML Webart

VML, quando embutido na marcação HTML , é lido e processado pelo Microsoft Internet Explorer (mas não por outros navegadores); por exemplo, o exemplo a seguir exibe um oval azul sólido:

<html xmlns:v>
<style>v\:*{behavior:url(#default#VML);position:absolute}</style>
<body>
<v:oval style="left:0;top:0;width:100;height:50" fillcolor="blue" stroked="f"/>
</body>
</html>

Implementações

O VML é usado pela maioria dos aplicativos do Microsoft Office , como o Microsoft Word e o Microsoft Visio , em arquivos HTML criados com a Save As HTML opção ' ' (HTML simples ou MHT ). Esses arquivos retêm informações vetoriais completas e podem ser reabertos para edição usando outros aplicativos da Microsoft, como o Microsoft PowerPoint . VML foi nativamente suportado pelo Internet Explorer da Microsoft até a versão 9 embutida em HTML, usando uma versão indefinida de namespaces SGML . O suporte para VML foi eliminado no Internet Explorer 10 e nas versões subsequentes.

Suporte para "anotações a tinta" em arquivos Office Open XML foi adicionado ao LibreOffice durante o ciclo de desenvolvimento 3.7.

VML não é nativamente suportado pela maioria dos navegadores da web. Navegadores da Web como Mozilla Firefox, Opera, Safari ou Google Chrome oferecem suporte a Scalable Vector Graphics (SVG) em vez de VML.

Renderização de e-mail em HTML do Microsoft Outlook

Embora o VML seja preterido como padrão no Internet Explorer, ele é mais comumente usado em relação ao desenvolvimento de e-mails HTML renderizados no Microsoft Outlook 2007, 2010 e 2013. O uso de imagens de fundo em campanhas de e-mail requer o uso de VML para ser exibido no Outlook porque o Outlook não oferece suporte aos atributos CSS ou HTML para imagens de fundo.

Imagens de fundo de célula de tabela de largura total

<html xmlns:v="urn:schemas-microsoft-com:vml">
    <head>
        <style>
            v:* { behavior: url(#default#VML); display: inline-block; }
        </style>
    </head>
    <body>
    <table width="100%" height="20">
        <tr>
            <td bgcolor="#dddddd" style="background-image:url('http://placekitten.com/g/500/300');background-repeat:no-repeat;background-position:center;" background="http://placekitten.com/g/500/300" width="100%" height="300">
            <!--[if gte mso 9]>
            <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="mso-width-percent:1000;height:300px;">
                <v:fill type="frame" src="http://placekitten.com/g/500/300" color="#ffffff" />
            </v:rect>
            <![endif]-->
            </td>
        </tr>
    </table>
</body>
</html>

Imagens de fundo da célula da tabela de largura total em mosaico

<html xmlns:v="urn:schemas-microsoft-com:vml">
    <head>
        <style>
            v:* { behavior: url(#default#VML); display: inline-block; }
        </style>
    </head>
    <body>
    <table width="100%" height="20">
        <tr>
            <td bgcolor="#dddddd" style="background-image:url('http://placekitten.com/g/500/300');background-repeat:no-repeat;background-position:center;" background="http://placekitten.com/g/500/300" width="100%" height="300">
            <!--[if gte mso 9]>
            <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="mso-width-percent:1000;height:300px;">
                <v:fill type="tile" src="http://placekitten.com/g/500/300" color="#ffffff" />
            </v:rect>
            <![endif]-->
            </td>
        </tr>
    </table>
</body>
</html>

Imagens de fundo da célula da tabela de largura especificada

<html xmlns:v="urn:schemas-microsoft-com:vml">
    <head>
        <style>
            v:* { behavior: url(#default#VML); display: inline-block; }
        </style>
    </head>
    <body>
    <table width="600" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse;">
        <tr>
            <td style="width: 300px; height: 80px; background-image: url('http://placekitten.com/g/300/80');">
            <!--[if gte mso 9]>
            <v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style='behavior: url(#default#VML); display: inline-block; position: absolute; width: 300px; height: 80px; top: 0; left: 0; border: 0; z-index: 1;' src="http://placekitten.com/g/300/80" />
                <v:shape xmlns:v="urn:schemas-microsoft-com:vml" id="theText" style='behavior: url(#default#VML); display: inline-block; position: absolute; width: 300px; height: 80px; top: -5; left: -10; border: 0; z-index: 2;'>
                <div>
             <![endif]-->
             <table width="300" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse;">
                 <tr>
                     <td height="80" align="center" valign="top" style="color:#ffffff;font-size:20px;"><span>Text</span></td>
                 </tr>
             </table>
             <!--[if gte mso 9]>
                 </div>
                 </v:shape>
             <![endif]-->
             </td>
         </tr>
    </table>
</body>
</html>

Veja também

Referências

links externos