Есть ли какая-либо Canvas-библиотека, подобная d3.js(это библиотека svg). У меня есть веб-сайт здесь, и я закодировал график с элементами svg, однако он не эффективен в браузерах смартфонов и работает так медленно. Теперь я хочу изменить его с помощью 2-го типа холста и посмотреть, лучше это или нет. Можете ли вы предложить библиотеку холста, которая полезна для этой цели?
Спасибо...
D3 не обязательно является единственной библиотекой svg - svg используется во многих случаях, но библиотека может делать любые представления, которые вы хотели бы сделать. См. Этот пример параллельных координат с использованием холста в D3 от Kai Chang: http://bl.ocks.org/2409451
Также см. здесь некоторые обсуждения проблем производительности и т.д., которые могут быть полезны: https://groups.google.com/d/topic/d3-js/mtlTsGCULVQ/discussion
Для приложение Samsung Olympic Genome Project facebook, мы использовали http://thejit.org, чтобы создать анимацию стиля графического стиля для приложения. Он сильно изменен мной и другими в моей команде, конечно, и играет только небольшую роль в приложении, но это довольно мощная структура.
Посмотрите Cytoscape.JS, который использует холст HTML5 для рендеринга. На момент написания этого он был в зачаточном состоянии, но проект кажется многообещающим. Согласно своей вики, библиотека поддерживает как настольные, так и мобильные браузеры:
Cytoscape.js легко интегрируется в ваш webapp, тем более что Cytoscape.js поддерживает как настольные браузеры, такие как Chrome и мобильные устройства браузеров, как на iPad.
Chart.js - это только что появившаяся библиотека javascript, которая создает графики, использующие HTML5 для рендеринга. Его не как функция включительно, как D3, но она работает, чтобы стать именно такой в будущем. http://www.chartjs.org/
Я знаю, что опаздываю на вечеринку, но времена изменились, и я считаю, что этот вопрос заслуживает обновленного ответа. Производительность SVG значительно улучшилась за эти годы, и особенно для нетривиальных графоподобных визуализаций, она часто дает превосходную производительность; но это действительно зависит от конкретного варианта использования: если визуализация проста и состоит из тысяч элементов, особенно на мобильных устройствах, Canvas может быть более быстрым вариантом. Если визуализация почти тривиальна, WebGL обеспечивает лучшую производительность и опережает Canvas, особенно на мобильных устройствах!
Однако, особенно WebGL и Canvas немного сложнее в использовании, чем декларативный подход, который использует SVG. Такие вещи, как CSS-анимация и переходы, легко сделать с помощью SVG и дают хорошую производительность благодаря аппаратному ускорению и полной независимости от производительности JavaScript. Canvas и WebGL всегда требуют JavaScript.
Если вы посмотрите на коммерческую библиотеку рисования графиков yFiles for HTML, вы увидите, что она предлагает все три технологии одновременно. Это потому, что все три могут быть лучшим выбором, в зависимости от конкретного варианта использования.
Есть запись в блоге, которая сравнивает производительность SVG, Canvas и WebGL, особенно в контексте визуализации графиков. Он сравнивает различные размеры графиков и категории устройств. "Вывод" заключается в том, что нет явного победителя. Часто сочетание всех трех технологий дает наилучшие результаты. Однако для небольших графиков SVG большую часть времени дает очень хорошие результаты и работать с ним приятно. По этой же причине я бы сказал, что d3.js фокусируется на SVG, а не на Canvas и WebGL.
В этой записи блога есть интерактивная демоверсия, которая позволит вам поиграть с различными технологиями и увидеть их сильные и слабые стороны. Конечно, демонстрация в основном сравнивает три технологии, используемые в этой конкретной библиотеке, поэтому ваши результаты могут отличаться, но они потратили много времени на оптимизацию всех трех технологий в этой библиотеке, поэтому я думаю, что результаты не слишком предвзяты.
Отказ от ответственности: я работаю в компании, которая создает вышеупомянутую библиотеку, но я не представляю своего работодателя здесь на SO.Я думаю, что то, что я сказал, должно быть действительно не только для этой библиотеки.