manipular javascript ajax svg

javascript - manipular - Scripting SVG



svg in javascript (5)

SVGWeb es una secuencia de comandos que agrega capacidades SVG casi nativas a IE mediante flash. Todos los otros navegadores principales son compatibles con SVG.

http://code.google.com/p/svgweb/

Estoy considerando desarrollar un sitio web similar a stackoverflow, pero las respuestas también pueden consistir en dibujos (esquemas, en este caso). Quiero tener un área en el formulario de respuesta donde puedan hacer este esquema sin requerir complementos especiales, etc.

  1. ¿Estamos al punto de que SVG tenga o deba tener masa crítica pronto (1 a 2 años) de manera que el diseño de un sitio web donde SVG ejecutado por script sea una característica principal sea razonable (es decir, que requiera Firefox u otro navegador SVG / AJAX)?
  2. ¿Cuáles son algunos buenos recursos para aprender scripting SVG multiplataforma (probablemente en javascript)?

-Adam Davis


1 / probablemente nunca - si IE quisiera agregarlo, entonces hubiera pensado que ya lo habría hecho; pero hay soluciones con SilverLight y Gecko para proporcionar renderizado. Por otro lado, hay API de gráficos entre navegadores disponibles. He hecho interfaces bastante grandes utilizando XULRunner y SVG, pero no había nada en la web que tuviera que atender a IE.

2 / Los dos que mencioné con más frecuencia fueron las páginas de SVG en mozilla.org y esta referencia SVG DOM . Todos mis enlaces SVG están aquí en delicious

Hay un editor existente en http://www.bpel4chor.org/editor/ ; también si todo lo que quiere es esquemas donde todos los arcos están en una cuadrícula, puede hacerlo bastante bien usando divs e imágenes sin SVG. O simplemente puedes ir a la ruta lo-fi


Como @jwmittag mencionó <canvas> es una opción.

Funciona en Saffari y Firefox 3, Opera 9, y las personas están desarrollando soporte para IE .

Puede capturar fácilmente los clics del mouse asociados con la herramienta y las propiedades actuales. Redibujando el lienzo en cada pantalla de página.

Acabo de terminar un proyecto usando <canvas> y es una API simple y muy poderosa para trabajar, especialmente si alguna vez has hecho algún trabajo de OpenGL o Cairo.

Buena suerte, suena como un proyecto genial.


Lamentablemente, no tengo una respuesta, pero tengo tres consejos para proyectos que podrías mirar.

El primero es el Lively Kernel de Dan Ingalls (sí, el Dan Ingalls) en Sun Labs. Es una implementación de Smalltalk Virtual World en JavaScript sobre SVG. Más precisamente, es una implementación del marco de GUI Morphic de Squeak Smalltalk en JavaScript usando SVG y un puerto de (partes de) Squeak Smalltalk en JavaScript.

O bien, si no eres un Smalltalker y lo anterior no tiene sentido para ti: es un sistema operativo, escrito en JavaScript con el intérprete de JavaScript como CPU, SVG como la tarjeta gráfica y el navegador como la computadora.

Esto es lo más extremo posible, cuando se trata de JavaScript y SVG. Y solo funciona completamente en Safari 3 y en parte en Firefox 3, aunque también hay un puerto experimental para Internet Explorer.

El segundo proyecto es el puerto Processing.js de John Resig del lenguaje de visualización Processing para JavaScript. Utiliza el elemento <canvas> lugar de SVG precisamente debido a los problemas que mencionaste. Éste, sin embargo, solo funciona en Firefox 3.

El tercero es Real-Time 3D en JavaScript por Useless Pickles. Utiliza solo JavaScript, DOM y CSS y no SVG o <canvas> o Flash o lo que sea. Y es portátil para casi cualquier navegador, incluido Internet Explorer 7 en adelante. Hacer 2D debería ser aún más fácil que esto.

Entre esos tres proyectos debería poder encontrar algo de inspiración y también encontrar a algunas personas que trataron de empujar el sobre con JavaScript y SVG o JavaScript y Gráficos y pueden decirle qué funciona y qué no.

Conclusión: hacer SVG entre navegadores o navegar entre navegadores <canvas> es casi imposible, pero con un poco de locura, los gráficos entre navegadores sin SVG o <canvas> son posibles.


Raphael parece una visión interesante del problema de los gráficos vectoriales entre navegadores.