¿Alguna sugerencia para una biblioteca de dibujo interactiva de JavaScript? Solo necesita dibujar líneas, polígonos, textos de diferentes colores. Compatible con IE/Firefox/Opera/Safari. Javascript drawing library?
Usted puede utilizar el objeto de la lona directamente a dibujar en 2D. IE requiere la biblioteca excanvas. de
http://developer.mozilla.org/En/Drawing_Graphics_with_Canvas
John Resig Processing.js es un buen marco para eso.
Dependiendo de cómo multi-navegador tiene que ser y su objetivo de hacer la salida, se puede intentar el elemento de la lona y el JavaScript relacionados.
Trate http://www.walterzorn.de/en/jsgraphics/jsgraphics_e.htm. Es lo mejor que he encontrado (sin recurrir a SVG) y funciona en la mayoría de los navegadores sin complementos.
Eso (dibujar mediante la disposición de elementos HTML) no se escala particularmente bien, pero ciertamente funciona :) – Dan
Cierto ... ciertamente no construirías un sistema CAD de esta manera, pero puede hacer dibujos bastante complejos si te quedas con estructuras e imágenes ortogonales (líneas, rectángulos, etc.) y les especias un poco con las imágenes. Otras entidades de dibujo se construyen con múltiples elementos DIV cada uno. –
walterzorn.com parece que ya no existe. :( –
Raphael es muy bueno para eso, y funciona en todos los navegadores, ya que utiliza VML (para MSIE) y SVG (para todo lo demás).
Maldita sea, me ganaste al golpe;) – Aeon
no es compatible con FF 2 – user121196
GRACIAS montones esto se ve súper increíble. usará Raphael. –
Dibujar texto con la etiqueta del lienzo es un gran dolor. Sus opciones son utilizar divisiones regulares absolutamente ubicadas en los lugares correctos, o buscar/escribir un motor de diseño de fuente (example), o esperar a que se implemente un nuevo estándar que le permita dibujar texto. SVG lidia con esto mucho mejor.
En IE que tienen ExplorerCanvas para simular la API de canvas con el propio marcado VML de IE. Sin embargo, VML nativo puede hacer texto en una ruta y cosas como SVG. Creo que teóricamente, si quieres manejar texto complejo, querrías SVG y VML, como la biblioteca de Raphael que mencionó Dan.
También puede considerar flash por un momento antes de comenzar.
De hecho, VML admite el dibujo de texto de forma nativa, y las últimas revisiones de ExplorerCanvas tienen los métodos de dibujo de texto recomendados por WHATWG;) http://explorercanvas.blogspot.com/ –
Solo como una actualización. El texto ya no es tan doloroso (2011), ha sido bastante bueno el año pasado. iOS4.1 + finalmente admite texto en lienzos correctamente y sé que Android 2.1+ también lo hace. Firefox/Safari/Chrome siempre han tenido un buen soporte de texto de lienzo e IE9 + también hace texto en Canvas correctamente. – Gabe
Pagar el jQuery Drawing plugin, y también puede consultar la referencia de Mozilla Canvas y tutorial.
también mxGraph. Esto no usa excanvas para IE. Excanvas es mucho más lento que el uso de VML, específicamente, la reutilización de los mismos nodos VML en lugar de eliminar, agregar nodos DOM para volver a dibujar. Este suele ser un punto pasado por alto, pero excanvas en el rendimiento de IE es simplemente horrible.
D3.js es una biblioteca JavaScript para manipular documentos basados en datos. D3 te ayuda a dar vida a los datos usando HTML, SVG y CSS. El énfasis de D3 en los estándares web le brinda todas las capacidades de los navegadores modernos sin vincularse a un marco propietario, que combina potentes componentes de visualización y un enfoque basado en datos para la manipulación de DOM .
Echa un vistazo a este discussion también.
El lienzo es el camino a seguir para algo más que unas pocas cajas o líneas triviales. Y excanvas funciona sorprendentemente bien, al menos en IE 7. – dgvid
Funciona muy bien con IE6 también. – Prestaul
parece que Raphael puede hacer más que simples cuadros y líneas ... http://raphaeljs.com/ – ina