cross browser - usar - Visualización de gráficos vectoriales en un navegador

svg html5 ejemplos (9)

¿Puedes aclarar a qué te refieres con el asunto "Windows lock-in" con Silverlight? Se ejecuta en Windows y MacIntel, y las porciones de vectores se ejecutan muy bien en Linux con el complemento Moonlight.

¿Te dejó sin la ayuda de Amiga?

Necesito mostrar algunos gráficos vectoriales interactivos (adjuntar con Oyentes DOM, etc.) en el sitio web en el que estoy trabajando. Existe una recomendación del W3C para SVG aunque este formato aún no es reconocido por el soporte de Internet Explorer, que es obligatorio (para un sitio web público). Sin embargo, IE maneja VML e incluso hay librerías javascript que hacen un dibujo tipo canvas dependiendo de un navegador (SVG vs. VML) - excanvas , GFX de Dojo Toolkit y más. Eso sería agradable y aceptable, aunque ninguno de ellos puede mostrar una imagen SVG del marcado dado.

Entonces la pregunta en realidad consiste en varias partes:

¿Hay alguna biblioteca JavaScript de navegador cruzado que muestre gráficos vectoriales de marcado dado (no obligatorio SVG) y ofrezca disponibilidad para adjuntar a eventos DOM?
Si no los hay, ¿cuál de las tecnologías más integradas en el navegador pupular sería la más adecuada para realizar esa tarea? Puedo elegir entre Flex / Flash, applet de Java. Silverlight no es una opción debido al bloqueo de Windows.

[ EDIT ] Gracias a todos por sus comentarios / sugerencias. A continuación se encuentran algunas de mis notas / conclusiones al azar sobre este tema:

El nivel de interactividad que necesito es la capacidad de detectar eventos DOM en la imagen vectorial que se muestra (mouseover, mouseout, clic, etc.) y la capacidad de reaccionar sobre ellos como cambiar el color de fondo, mostrar el diálogo, etc.
La idea de seguir con el formato SVG es bastante buena ya que es nativa en muchos navegadores, excepto en la más popular: IE. Después de experimentar con la visualización de SVG dinámico, me di cuenta de que IE versión 7 era la más problemática. Hay demasiada molestia debido a las incompatibilidades del navegador.
Cake parece un excelente marco de Javascript, aunque no pude conseguir que los ejemplos funcionen en IE7.
Applets de Java: me gustó más esa idea porque pensé que podría usar la biblioteca de Apache Batik, un procesador SVG de calidad. Sin embargo, Batik es una gran biblioteca y no puedo permitirme implementar un applet que pesa unos pocos megabytes.
Decidí seguir con la opción Flex. Encontré una buena biblioteca de gráficos vectoriales Degrafa . Utiliza su propio formato de marcado, sin embargo, reconoce la notación de ruta SVG, por lo que en mi caso va a ser bastante fácil transformar mis archivos SVG usando XSLT o simplemente analizarlos.

[ EDIT 2 ] Aparecieron algunos más comentarios. Me gustaría aclarar que con "Windows lock-in" me refiero a la situación que Silverlight normalmente correría en Windows, más específicamente, IE. Dudo que sea una solución aceptada (como Flash o Java Applet, por ejemplo) en otros sistemas. Sí, no tengo dudas de que uno puede ejecutar la aplicación Silverlight en cualquier sistema, aunque me temo que sería demasiado esfuerzo para un usuario promedio.

@ Akira: ¿Has tenido algún problema con esos "renderizadores SVG" en IE7? Me lanzan errores de Javascript todo el tiempo.

De todas las posibilidades que enumera, la única que no es un abuso horrible de una tecnología existente (Javascript), apenas compatible (SVG, elemento Canvas) o mucho trabajo (Java) es Flash. Fue diseñado como un paquete de gráficos vectoriales y es compatible con más navegadores que SVG y la etiqueta canvas.

La única razón por la que no elegiría Flash sobre todas las demás opciones es si está apuntando a navegadores móviles o si no tiene el presupuesto para el paquete Flash.

Eche un vistazo al nuevo elemento Canvas que se ha implementado en muchos navegadores. También escuché que hay un control ActiveX para IE que también implementa el elemento Canvas.

Actualización: Espera, ya dijiste eso. ¡Debería leer toda la pregunta la próxima vez! :)

IE admite VML, pero nada más lo hace y es feo. Microsoft afirmó que lo habían descartado (con XAML nuevo y todo), pero todavía forma parte de su formato XML de Office (así es como Excel .xlsx admite comentarios, lo cual es bastante extraño).

FX y cargas más soportan el nuevo elemento Canvas. Muchos soportan SVG, pero dado el trabajo que MS está haciendo en Silverlight, no puedo ver que IE sea compatible con SVG en el corto plazo.

Se supone que Microsoft proporciona plug ins Silverlight para ningún sistema operativo MS.

He estado usando Flex, es bastante bueno a pesar de usar Eclipse. No necesita comprar los costosos componentes del servidor Adobe para usar Flex: puede consumir servicios SOAP.

Las herramientas de desarrollo para Flex son bastante asequibles, y casi todos tienen Flash.

No creo que SVG sea una buena opción para el futuro. De la Wikipedia :

"El complemento IE más común fue producido por Adobe. Sin embargo, Adobe planea retirar este producto a principios de 2009".
"... Internet Explorer que tampoco soportará SVG en la próxima versión IE8"
"... todos tienen soporte incompleto para SVG 1.1 ..."
"El complemento Corel SVG Viewer se ofreció una vez desde Corel. Su desarrollo se ha detenido".

Safari, Opera y Firefox son compatibles con SVG de forma nativa (por ejemplo, sin complementos) en diversos grados de integridad y corrección, incluida la capacidad de ejecutar scripts desde JavaScript.

También está el elemento de lienzo que ahora se está estandarizando en html5, y también es compatible con los navegadores anteriores (con varias peculiaridades en ciertos casos de borde debido a cambios relativamente recientes en el borrador de html5).

Desafortunadamente, cualquier enfoque basado en estándares es destruido por el desprecio deliberado de IE de lo que sucede fuera de su propio ecosistema, sin embargo, hay una serie de bibliotecas que intentan convertir lienzo / svg en VML (lenguaje vectorial propietario de IE) como iecanvas .

[Editar: ¡Ups! Olvidé mi biblioteca js favorita - ¡ Cake ! que puede analizar y mostrar svg en lienzo, y cree que soporta IE también]

[Sin embargo, otra edición: Cake en realidad tiene una demo haciendo lo que creo que quieres hacer]

Vaya por SVG, y solo diga a los usuarios que obtengan el complemento ADOBE SVG para IE.

Vea este excelente sitio, que es un sitio del gobierno del Reino Unido (servicio público)

ELGIN

Walter Zorn tiene una biblioteca de JavaScript para gráficos vectoriales arbitrarios. Se ve decente.

Eche un vistazo a la biblioteca Javascript de Raphael . Es temprano pero parece muy prometedor.

Recuerdo la hoja de ruta de IE que tenía compatibilidad con SVG enumerada en IE7.2.

Depende de qué tan interactivo lo quieras?