JavaScript-библиотеки для работы с SVG

[rizhij_poplavok]

Отметил для себя Pottis.js, так как работал с Raphael'em и были моменты когда это было нужно. Выкручивался навешивая на html элемент событие и по событию делал какие то изменения в SVG объекте.
Аля jQuery + Raphael.
Но Pottis.js по весу меньше, спасибо за наводку.

[ozoned]

В Raphaël же по-моему есть события?
raphaeljs.com/reference.html#events
Или не хватало их?

[rizhij_poplavok]

Да, есть. Хотел сразу написать про это и дать ссылку, но нет возможности публиковать ссылки.

[antirek]

У меня аналогично: )
А потом стал перерывать github в поисках полезных JS скриптов и наткнулся на pottis.js

[serf]

Использовал Protovis, не упомянута, из представленных наверно будет ближе к D3.

[ingspree]

D3 — это того же автора, что и протовиз, только чуть дальше абстрагирована и немножко другие цели. Потомок, так сказать. Protovis больше для статической визуализации, а d3 больше для манипулирования, интерактивности и анимации всякой.

[allex]

А как Protovis и D3 соотносятся с InfoVis? По демкам что-то близкое.

[ingspree]

Честно говоря, я инфовиз не юзал, мне апи протовиза импонирует больше — там строишь свои графики, а в инфовизе чаще юзаешь готовые. Но на самом деле сравнить не могу.

[alist]

Неделю назад столкнулся с проблемой производительности Raphael при интерактивном изменении документа в Opera и Firefox — пришлось отказаться. Первое время боялся, что придется пересаживаться на canvas, но потом попробовал jQuery SVG и оказалось, что для нашего юскейса его хватает.

А вообще никак не могу найти какую-нибудь библиотеку, которая из canvas переносит в SVG — в обратную сторону есть полно решений (что неудивительно — задача вполне себе несложная). У многих проектов такая фича заявлена как future, но ни один из них еще не предоставил хотя бы промежуточного кода. Жаль.

С другой стороны, jQuery SVG оказался весьма неплохим, а с учетом того, что экспорт данных в SVG Рафаэль поддерживается «из коробки», мы почти ничего не потеряли.

Автору спасибо за ссылки, хотелось бы поподробнее узнать об SVGweb — нас он оттолкнул тем, что использует Flash на старых IE.

[theOnlyBoy]

Попробуйте ex-canvas code.google.com/p/explorercanvas/
Приходилось делать динамические карты местности на canvas с поддержкой IE,
данная библиотека неплохо справилась с не очень сложными задачами.
Пришлось дописать функционал для нее для динамически-изменяемых элементов, правда,
но основную задачу по отрисовке она выполняет.

[egorF]

Аналогично: пришлось отказаться от Raphael по причине низкой производительности. Написал candlestick графики на голом SVG — получил скорость, в десятки (!) раз превышающую Raphael на тех же path'ах.

[ArtemSmirnov]

У Raphael можно не хило увеличить производительность если кешировать аттрибуты, так например translate сначала берет значение аттрибута у элемента а затем устанавливает новое следовательно лишние мидлительные обращения к DOM

[antirek]

У pottis.js есть пример типа экспорта из canvas в SVG: www.pottisjs.com/examples/canvas_import/,
но только целиком как картинку, так что, возможно, это не то, что вы имели в виду.

SVGWeb мне показался слишком недружественным к программисту :) Т.е. если сравнить код из доки svgweb:
svg = document.createElementNS(svgns, 'svg');
svg.setAttribute('width', 100);
svg.setAttribute('height', 100);

с подобным на Raphael'е:
var paper = Raphael(10, 50, 320, 200);
то, понимаешь, что проще юзать не SVGWeb.

[alist]

Вот спасибо, посмотрю на Pottis обязательно!

[TedBeer]

поддержка SVG есть в AmpleSDK (поддерживается IE >= 5.5)

[ArtyV]

О, круто. Было бы неплохо сравнить производительность с Raphael. (Просто любопытно)

[dom1n1k]

Можно добавить еще Fabric.js — это canvas-фреймворк со встроенным SVG-парсером.
Демо: kangax.github.com/fabric.js/demos/kitchensink/index.html