SGV, ou Scalable Vector Graphics (Gráficos Vetoriais Escaláveis) é uma linguagem baseada em XML, projetada para a criaação de gráficos vetoriais estáticos e dinâmicos, ou animados através de comportamentos JavaScript/DOM. A linguagem foi criada pelo W3C e também pode ser manipulada com ASP, PHP e JSP.
Essa tecnologia permite três tipos de objetos gráficos:
- figuras geométricas vetoriais;
- imagens raster/bitmap;
- texto.
A grande vantagem do formato SVG, é que não há perda de qualidade nas imagens quando ampliadas, ao contrário do que acontece com os formatos convencionais (por pixels), como: JPG, BMP, GIF e PNG. Também é uma linguagem Open Source. Nenhuma marca tem direitos exclusivos sob a utilização da mesma, e não exige a legalização de determinados softwares/aplicativos.
Onde está a graça?
Na possibilidade de criação de gréficos e figuras geométricas de forma dinâmica. Jé imaginou a criação de gráfcos a partir de valores vindos de bancos de dados? Para se ter uma idéia, o Google Analytics faz algo parecido, porém utilizando a tecnologia Flash.
Exemplo de gráfico gerado a partir de dados fornecidos pelo usuário:
No caso acima, o grafico foi gerado depois de eu setar o número 40 para o campo de canditado 1, e 100 para candidato 2. Se eu tivesse setado 60 para o campo candidato 1, a porcentagem cresceria, imediatamente.
Infelizmente, não são todos os browsers que suportam SVG. Atualmente, talvez os únicos que suportam: Firefox e Opera
Saiba mais sobre Gráficos Vetoriais Escaláveis.
Nunca tinha visto mais gordo!
Quando eu li esta notícia, a dois anos, pensei: “será uma grande revalução na web”. Já imaginei a Web fazendo de imagens e gráficos, o que os editores visuais fazem com vetores no CorelDraw. Mas até hoje, é difícil ver a utilização desta tecnologia.
Sou do tipo que não importa de usar tecnologia não difundida, mas se for o caso de dar soluções… E como você disse, gerar esses gráficos em serviços que fornecem estatística, é uma boa. Essa idéia de editar gráficos por códigos de texto é muito legal, mas difícil!
Uma vez tentei aprender, e acabei desistindo… rs
Inté
Infelizmente a incompatibilidade do IE (pra variar) já é causa suficiênte para não adotar esta técnica… Pois infelizmente ele dominia o mercado…
O jeito é usar o flash mesmo. embora precise do plugin, é algo bem mais comum, e pode-se obter os mesmos resultados…
Legal Thalis. Já tinha lido algo sobre o SVG no Tableless.com.br, mas é sempre bom dá uma relembrada
Rael, é verdade. O IE dominia o mercado. Mas se for comparar as estatisticas do share voltado ao desenvolvimento/design de internet, houve um crescimento muito grande do Mozilla/Firefoz. A Microsoft sá forçada a adaptar-se, enquanto todos os outro browser vem trabalhando pra isso.
O IE 7 é apenas o começo disso. Espero que eles façam um browser de verdade, ainda. Coisa que eu duvido.
Poxa, faz um tempinho mas eu já brinquei disso em um curso =) …
Muito interessante mesmo, vou voltar a olhar isso.
Abração!
Ótimo artigo Thalis. Acho que imagens vetorizadas são as melhores para se aplicar em web sites. O mais legal é o que você mesmo disse, utilizar em gráficos.
Gostei muito desse artigo, parabéns!
Eu ja tinha lido sobre isso, mas nao dei importancia… agora que voce escreveu esse artigo, eu saquei o qto pode ser bom a sua utilização. a parte ruim é por a mao na massa, que é sempre complicado
Já havia tido contato no ano passado… Quando descobri as possibilidades, realmente me impressionei!
Porque não se trata de um arquivo, mas de um código que “cria” a imagem vetorial, ou seja, não há a necessidade de hospedar um arquivo para que seja aberto na tela, simplesmente… vetor! Hehe…
O legal é que editores como Adobe Illustrator possuem suporte. Desta forma você pode criar seu vetor e mandar o programa salvar em SVG pronto
O illustrator cria SVG, mas não os possibilita de forma dinamica. O fato mais importante do SVG é criar imagens que podem ser editadas via codigo, dinamicamente. Nao há nexessidade de imagem estatica. É preferivel usar GIF ou PNG.
Sei lá, isso ainda me parece estar engatinhando. Mas começa assim, e daqui a pouco temos um webbased Corel Draw. Já pensou?! =-D
Aê Thalis, passando p/ participar do blog!! hehehe
conforme prometido
Gostei da idéia dos gráficos…bem mais prático!
o blog tah 10,Thalis! Parabéns pelo artigo.