SVG en Firefox
on
on
INTRODUCCION
Hacía tiempo que conocía de la existencia del formato .SVG [Scalable Vector Graphics] pero hasta hace unos días no había indagado en él y me di cuenta de las posibilidades que ofrece.
¿Te imaginas la posibilidad de poder agrandar una imagen 10 veces su tamaño [o incluso más] sin perder calidad? Yo he cogido una imagen de 477×605 píxeles y la he renderizado a 5724×7260 píxeles pasando de 2,56 MB de memoria usada a 358 MB.
Es decir, el límite de renderizado lo marca el ordenador en el que estés y no la calidad de la imagen. Esto es asi porque el SVG maneja vectores o nodos como hace Illustrator o CorelDraw, de forma que todo es escalable sin pixelarse.
Si quieren saber mas del formato los invito a mirar:
WIKIPEDIA
USO DEL FORMATO
Este formato es ideal para crear imágenes para plasmar en una pancarta, un póster o una camiseta simplemente. Ahora bien, una vez mostrada la diferencia, ¿cómo crear imágenes .SVG? No te compliques la vida buscando programas para crear imágenes en este formato, simplemente convirtiendo en esta página tus imágenes .JPG a .SVG conseguirás lo que quieres y gratis.
Por otra parte, ¿cómo puedes ver tus imágenes? Con un programa gratuito como GIMP puedes abrir estas imágenes, renderizarlas al tamaño que te dé la gana (o que tu ordenador pueda soportar) y luego guardarlas en cualquier otro formato que quieras con su nuevo tamaño y sin perder calidad.
VISUALIZANDO EN FIREFOX
Sin embargo, el tema central de este post no es tanto alabar las cualidades del formato .SVG sino explicar cómo conseguir visualizar este formato en el Firefox. Los chicos de Mozilla han difundido la mentira “verdad a medias” que a partir de la versión 1.5 este navegador viene con soporte nativo para .SVG lo cual puedes comprobar que no es verdad si miras a continuación una imagen que dejo de ejemplo:
Seguro esta imagen te da ERROR,
o te dice que no tienes EL PLUGIN para verla, pero luego no descarga ningun plugin,
o te dice un monton de codigos pero no ves ninguna imagen, ¿verdad?
Pues ocurre lo mismo hagas lo que hagas, incluso modificando a pelo la imagen con el Notepad [Bloc de Notas] para corregirla.
Sí, puedes modificar una imagen en este formato a través de su código. Curioso, ¿verdad?
Aca te dejo de YAPA (extra bonus) una web donde puedes pasar tu JPG a SVG en codigo para meterlo en una pagina php:
>> MIRA ESTA WEB <<
SOLUCIONANDO EL PROBLEMA
Ahora bien, vamos directo a la solución... después de buscar y probar diferentes cosas he dado con la solución al problema, y se las describiré por pasos:
1. Descarga el Adobe SVG Viewer e instálalo.
Ahi abajo elijen donde dice Viewers la primera sección, buscan su sistema operativo y descargan, la version actual es 3.03.
NOTA: Hay gente que ha probado la Beta que es el SVG viewer 6.0 (LINK: ), ya que a anteriormente la versión final 3.03 no funcionaba con la última versión de Firefox aunque sí funcione con el Internet Explorer. Sin embargo ya funciona la version final para Firefox, comprobado por mí.
2. Una vez instalado, vete a la carpeta de instalación del SVG Viewer (normalmente C:Archivos de programaArchivos comunesAdobeSVG Viewer 3.0Plugins) y copia los archivos NPSVG3.DLL y NPSVG3.ZIP en la carpeta de plugins del Firefox (normalmente C:Archivos de programaMozilla Firefoxplugins).
(la carpeta del SVG Viewer 6 es C:Archivos de programaArchivos comunesAdobeSVG Viewer 6.0Plugins y los archivos a copiar son NPSVG6.DLL y NPSVG6.ZIP correspondientemente a la versión)
3. Reinicia el Firefox y comprueba que tienes el plugin funcionando tecleando about:plugins en la barra de direcciones. Te va a aparecer Adobe SVG viewer, seguramente arriba de todo, con la version y los archivos que pusimos arriba, eso estaría OK.
4. Ahora falta, solo desactivar el "soporte nativo" que trae Firefox para SVG para así usar el que acabamos de instalar. Para eso vamos a escribir about:config en la barra de direcciones.
En el campo busqueda ponemos svg para que muestre directamente la entrada correspondiente y encontraremos:
svg.enabled y a ese campo le hacemos doble click para cambiar su valor de TRUE (encendido) a FALSE (apagado).
5. Solo resta Reiniciar el Firefox para que tome el nuevo plugin.
Y ahora .
Aparecerá un cuadro referente al uso del plugin por primera y unica vez, acepta y espera a que cargue.
FELICIDADES, Ya tienes tu Firefox listo con verdadero soporte para .SVG !!!!!!!!!!
(PROBADO en FIREFOX 3.6 con Adobe SVG viewer 3.03 en WinXP-SP3, actualizados a la fecha)
No creo que quieras volver al soporte nativo de Firefox, pero en el caso que sufras de enajenación transitoria puedes volver a teclear about:config y volver a establecer el valor que cambiaste a true.
UNA SUPERIMAGEN SVG de FIREFOX logo:
http://www.codedread.com/images/firefox-logo.svg
NOTA: TARINGA NO ACEPTA LOS SVG como imagen, una pena!
Eso es todo, espero que le sea util.
http://www.codedread.com/images/firefox-logo.svg
NOTA: TARINGA NO ACEPTA LOS SVG como imagen, una pena!
Eso es todo, espero que le sea util.

