Библиотека чертежей Javascript?

Question

Любое предложение для интерактивной библиотеки рисования JavaScript? Просто нужно рисовать линии, полигоны, тексты разных цветов. Совместимость с IE/Firefox/Opera/Safari.

Answer 1

Вы можете использовать объект canvas непосредственно для рисования в 2D. IE требует библиотеки excanvas.

http://developer.mozilla.org/En/Drawing_Graphics_with_Canvas

Answer 2

Резиг-х Processing.js хорошая основа для этого.

Answer 3

В зависимости от того, насколько вам необходим кросс-браузер и ваша цель сделать вывод, вы можете изучить элемент Canvas и соответствующий javascript.

Canvas

Answer 4

Попробуйте http://www.walterzorn.de/en/jsgraphics/jsgraphics_e.htm. Это лучшее, что я нашел (не прибегая к SVG) и работает в большинстве браузеров без надстроек.

Answer 5

Raphael довольно круто для этого и работает в разных браузерах, поскольку он использует VML (для MSIE) и SVG (для всего остального).

Answer 6

Рисование текста с тегом холста - большая боль. Ваши варианты состоят в том, чтобы использовать регулярные divs, абсолютно расположенные в правильных местах, или найти/записать механизм макета шрифта (example) или дождаться, когда будет реализован новый стандарт, который позволит вам нарисовать текст. SVG имеет дело с этим намного лучше.

В IE у вас есть ExplorerCanvas, чтобы имитировать API холста с собственной разметкой VML IE. Однако родной VML может делать текст на пути и такие вещи, как SVG. Я думаю, что теоретически, если вам нужна сложная обработка текста, вам нужны SVG и VML, как библиотека Raphael, о которой упоминал Дэн.

Вы также можете рассмотреть Flash на мгновение перед запуском.

Answer 7

Как уже упоминалось выше, холст - это то, как вы должны идти. IE не поддерживает его изначально, поэтому вам необходимо загрузить ExCanvas, чтобы обеспечить совместимость между браузерами. Я бы рекомендовал посмотреть на Ajaxian для некоторых проектов, которые используют тег canvas.

Answer 8

Оформить заказ jQuery Drawing plugin, а также посмотреть ссылку Mozilla Canvas и tutorial.

Answer 9

Также mxGraph. Это не использует excanvas для IE. Excanvas работает медленнее, чем использование VML, в частности, повторно использовать те же узлы VML, а не удалять, добавляя узлы DOM для перерисовки. Это часто упускается из виду, но excanvas на производительность IE просто ужасен.

Answer 10

D3.js

D3.js библиотека JavaScript для работы с документами на основе данных. D3 помогает вам оживлять данные с помощью HTML, SVG и CSS. D3's акцент на веб-стандарты дает вам все возможности современных браузеров, не привязывая себя к собственной структуре, сочетая в себе мощные компоненты визуализации и подход с данными к DOM .

Посмотрите также на этот discussion.