Библиотека JS Charts/Graphs, которая хорошо работает с AngularJS?

Я ищу библиотеку диаграмм/графиков javascript, которая хорошо работает с AngularJS. Это не обязательно должно быть бесплатно.

Я намереваюсь реализовать в основном линейные графики, однако с некоторой сложностью, поэтому они должны иметь широкие возможности настройки (например, синхронизированные графики, несколько осей Y, включать как линии, так и отдельные точки в один и тот же график, обрабатывать до 10 000 точек...)

Highcharts кажется очень хорошей библиотекой, но она основана на jquery. У него есть эта оболочка: https://github.com/pablojim/highcharts-ng , но там сказано, что «из-за многих проверок на равенство директива может работать медленно с большими наборами данных».

Другие варианты, которые я рассматриваю:

  • ZingChart
  • FusionCharts
  • Google диаграммы
  • НВД3
  • nv-диаграммы

Я открыт для других вариантов...

Как насчет jtblin.github.io/angular-chart.js ?
Спасибо! Chart.js действительно выглядит привлекательной библиотекой, но их API кажется очень тонким по сравнению с богатыми возможностями, которые предоставляют другие библиотеки. Я знаю, что в этой функции мне понадобится что-то сложное, чего они не поддерживают.
D3js, вероятно, самая мощная/популярная бесплатная JS-библиотека, поэтому обертка для нее была бы идеальной ( github.com/mbostock/d3/wiki/Gallery ). Я нашел dashingd3js.com/d3-resources/d3-and-angular Давайте поищем другие. И, пожалуйста, смотрите также мой вопрос softwarerecs.stackexchange.com/questions/21614/…
D3 действительно мощный, но практически все приходится рисовать самому. Для моих нужд нет причин не использовать существующую библиотеку - хотя мне нужно много функций, нет такой функции, которая так или иначе не была бы реализована существующими библиотеками.
Я решил начать с Highcharts PoC. О результатах отпишусь здесь.

Ответы (4)

ZingChart имеет собственную директиву AngularJS: https://github.com/zingchart/ZingChart-AngularJS .

Он имеет три способа ввода данных в диаграмму, каждый из которых имеет свою собственную стоимость производительности и функциональные преимущества. Я описал каждый из них здесь: http://www.zingchart.com/blog/2015/03/05/zingchart-angularjs/ .

Я работаю в команде ZingChart, и мне посчастливилось создать директиву, поэтому не стесняйтесь обращаться к нам, если у вас есть какие-либо вопросы.

Поскольку вопрос помечен как бесплатный, я должен отметить, что Zing бесплатен только в том случае, если вы брендируете свои диаграммы, что не всем нужно. Подробнее на zingchart.com/buy

Essential Chart для JavaScript — еще один вариант, который стоит рассмотреть. Простой пример приложения: ссылка .

Весь набор элементов управления доступен бесплатно в рамках программы лицензирования сообщества , если вы соответствуете требованиям. Примечание: я работаю в Syncfusion.

Поскольку вы работаете в Syncfusion, не могли бы вы рассказать нам, как использовать библиотеку с AngularJs (о чем, в конце концов, и идет речь). Спасибо
Пожалуйста, обратитесь к этой ссылке на документацию для использования диаграммы с Angular JS.
Спасибо. Ваш продукт выглядит великолепно, и я очень впечатлен чрезвычайно щедрой лицензией сообщества: «Кто имеет право? Отдельные разработчики или до пяти пользователей в компаниях с годовым валовым доходом менее 1 миллиона долларов США».

В моем проекте я использовал D3.js , и он очень хорошо работал с AngularJS (v 1.2/1.3).

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

РЕДАКТИРОВАТЬ:

  • есть линейные графики
  • обрабатывает много объектов
  • свободно

D3.js создает SVG, поэтому библиотека обрабатывает все, что может SVG.

Я не знаю лучшей, более популярной и бесплатной библиотеки JS для построения диаграмм, чем D3.js. Тем не менее, доступные оболочки не охватывают все типы диаграмм, поэтому вам, возможно, придется немного поработать над ними. Я только что начал проект AngularJs и намерен использовать D3.js, поэтому был бы признателен, если бы jsDoggy разместил несколько ссылок на то, как создавать новые директивы для D3.js Thanx
Конечно, у меня также есть код для «внедрения» D3.js. Когда найду фрагмент, выложу сюда. Более того, как сказал @Mawg, я покажу пример директивы. РЕДАКТИРОВАТЬ: было бы полезно: ng-newsletter.com/posts/d3-on-angular.html

FusionCharts будет наиболее подходящей библиотекой Javascript в соответствии с вашими требованиями. В библиотеке есть директива FusionCharts-Angular , которая упростит создание диаграмм в вашем приложении Angular. Библиотека также позволяет вам настраивать все атрибуты диаграммы, чтобы ваша диаграмма выглядела так, как вы хотите.

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

Буду рад помочь, если вам понадобятся дополнительные советы.