SVG

De Wikinet
Ir para: navegação, pesquisa
Exemplo de qualidade.

SVG, sigla para Sou Viado e Gay Scalable Vectorial Graphics, é um formato de gráfico vetorial muito doido e ineficiente, incompatível com a maioria dos programas gráficos, mas que ganhou grande popularidade porque foi adotado como padrão na Wikipédia. Ser vetorial significa que os arquivos desse formato não são um mapa dos pixels como o BMP (que perde resolução ao ser expandido), mas sim um cálculo de proporções entre as linhas, permitindo que seja expandido ou encolhido o quanto quiser sem perda de qualidade. Para criar imagens desse tipo é preciso usar o Inkscape.

Por ser um padrão aberto, livre, de fácil implementação, é claro que a Microsoft não quer que ele tenha sucesso, então todos os browsers suportam SVG, menos o Internet Explorer.

Conceito[editar]

Um arquivo SVG não é nada além de um arquivo XML, ou seja, é um texto formatado com aquelas tags malucas do tipo <porra>alguma porra qualquer</porra>, que representa vetores, ou pode até mesmo representar um bitmap. Por ser um arquivo de texto, um arquivo SVG é human-readable, ou seja, você pode até abrir o arquivo em um editor de texto e entender o que está lá (isso se você for maluco; mas estamos pressupondo isso a partir do momento que você resolveu ler este artigo).

A forma mais simples de representar vetores no SVG [1] é usando o "path". O "path" diz onde o vetor começa, e se o ponto seguinte deve ser ligado por uma linha (L) ou por um movimento sem ligar (M), terminando com z (se for para ligar o final ao começo). Por exemplo, pegue o texto abaixo, copie e cole em um arquivo (suastica.svg) e veja que merda é essa:

<svg width="4cm" heigth="4cm" viewBox="0 0 400 400"
  xmlns="http://www.w3.org/2000/svg" version="1.1">
<path fill="none" stroke="black" d="M 100 100 L 200 100 L 200 300 L 300 300 " />
<path fill="none" stroke="black" d="M 100 300 L 100 200 L 300 200 L 300 100 " />
</svg>

Uma das vantagens do SVG é que por ser human-readable (se o tal human for um psicopata, obviamente) é que é muito fácil pegar um SVG que contenha texto [2] escrito em uma língua e traduzir para outra - dá até para fazer estas conversões de forma massiva, através de scripts escritos em linguagens que tratem bem de arquivos XML (como, por exemplo, perl).

SVG pode ser usado para adicionar textos (ou linhas, curvas, etc) a imagens JPG ou PNG e, desta forma, torna-se possível mudar o texto (ou as linhas, etc) sem editar a imagem. Isso é feito usando-se <image ...> no SVG.

Existe também um modo de criar animações SVG, usando <animate ...>

Conversores de bitmap para SVG[editar]

Existem vários programas para converter bitmap (que, na nomenclatura dos documentos SVG, é chamado de raster) para SVG. Estes programas procuram trocar as bordas entre regiões por linhas, e colorir cada região da mesma cor. Obviamente, o resultado é uma merda, mas pode servir como primeiro passo para colorir imagens em preto e branco.

Por exemplo, a imagem abaixo foi gerada pelo programa pamtosvg (foi preciso dar uma pequena editada na tag <svg ...>), o problema maior não está na conversão PBM para SVG, mas na grande perda de informação ao passar de JPG para PBM:

Claro que essa transformação foi feita de forma burra, então o resultado tinha que ficar uma merda. O certo era, antes, ter rodado um programa para fazer a detecção de borda, e depois, com as bordas marcadas, rodar o conversor para SVG.

Ver também[editar]

Referências

  1. SVG na página do W3C (coisa de doido, ou seja, é para você mesmo)
  2. Textos, mas só tente ler isso se você for doido varrido