JS Charts/Graphs Library que funciona bien con AngularJS?

Estoy buscando una biblioteca de gráficos/gráficos de javascript que funcione bien con AngularJS. No tiene que ser gratis.

Tengo la intención de implementar principalmente gráficos de líneas, sin embargo, con cierta sofisticación, por lo que deberían ser altamente personalizables (por ejemplo, gráficos sincronizados, múltiples ejes, incluir líneas y puntos separados en el mismo gráfico, manejar hasta 10k puntos...)

Highcharts parece una biblioteca muy buena pero está basada en jquery. Tiene este contenedor: https://github.com/pablojim/highcharts-ng , pero dice allí que "Debido a muchas verificaciones de igualdad, la directiva puede ser lenta con grandes conjuntos de datos".

Otras opciones que estoy considerando:

  • ZingChart
  • FusionCharts
  • Gráficos de Google
  • NVD3
  • gráficos nv

Estoy abierto a más opciones...

¡Gracias! Chart.js parece una biblioteca llamativa, pero su API parece muy delgada en comparación con las ricas posibilidades que exponen otras bibliotecas. Sé que en la función necesitaré algo complejo que no admitan.
D3js es probablemente la biblioteca JS gratuita más poderosa/popular, por lo que un contenedor para eso sería ideal ( github.com/mbostock/d3/wiki/Gallery ). Encontré dashingd3js.com/d3-resources/d3-and-angular Busquemos otros. Y vea también mi pregunta softwarerecs.stackexchange.com/questions/21614/…
D3 es realmente poderoso, pero prácticamente tienes que dibujar casi todo tú mismo. Para mis necesidades, no hay razón para no usar una biblioteca existente; aunque necesito muchas funciones, no hay ninguna función que las bibliotecas existentes no implementen de una forma u otra.
Decidí comenzar con un PoC de Highcharts. Publicaré aquí los resultados.

Respuestas (4)

ZingChart tiene su propia directiva AngularJS: https://github.com/zingchart/ZingChart-AngularJS

Tiene tres formas de inyectar datos en un gráfico, cada una con su propio costo de rendimiento y beneficio de funcionalidad. Describí cada uno de ellos aquí: http://www.zingchart.com/blog/2015/03/05/zingchart-angularjs/ .

Estoy en el equipo de ZingChart y por casualidad creé la directiva, así que no dude en comunicarse si tiene alguna pregunta.

Dado que la pregunta está etiquetada como gratis, debo señalar que Zing solo es gratis si marca sus gráficos, lo que no todos querrán. Más en zingchart.com/buy

Essential Chart for JavaScript también es otra opción a considerar. Aplicación de muestra simple: enlace .

Todo el conjunto de controles está disponible de forma gratuita a través del programa de licencia comunitaria , si reúne los requisitos. Nota: Trabajo para Syncfusion.

Ya que trabaja para Syncfusion, ¿puede decirnos cómo usar la biblioteca con AngularJs (que, después de todo, es de lo que se trata la pregunta). Gracias
Consulte este enlace de documentación para usar el gráfico con Angular JS.
Gracias. Su producto se ve muy bien y estoy muy impresionado por la licencia comunitaria extremadamente generosa: "¿Quién es elegible? Desarrolladores individuales o hasta cinco usuarios en empresas con ingresos brutos anuales inferiores a $ 1 millón de dólares"

En mi proyecto usé D3.js y funcionó muy bien con AngularJS (v 1.2/1.3).

Creé algunas directivas nuevas relacionadas con el tipo de gráficos que necesitaba. No tuve problemas.

EDITAR:

  • tiene gráficos de líneas
  • maneja muchos objetos
  • libre

D3.js crea un SVG para que la biblioteca maneje todo lo que SVG puede.

No conozco una biblioteca de gráficos JS mejor, más popular y gratuita que D3.js. Dicho esto, los contenedores disponibles no cubren todos los tipos de gráficos, por lo que es posible que tenga que trabajar un poco allí. Acabo de comenzar un proyecto AngularJs y tengo la intención de usar D3.js, por lo que estaría agradecido si jsDoggy publicara algunos enlaces sobre cómo crear nuevas directivas para D3.js. Gracias.
Por supuesto, también tengo algo de código para "inyectar" un D3.js. Cuando encuentre un fragmento, lo publicaré aquí. Además, como dijo @Mawg, mostraré una directiva de ejemplo. EDITAR: sería útil: ng-newsletter.com/posts/d3-on-angular.html

FusionCharts sería la biblioteca Javascript más adecuada según sus requisitos. La biblioteca tiene la Directiva FusionCharts-Angular , que hará que la creación de gráficos en su aplicación Angular sea muy sencilla. La biblioteca también le permite personalizar todos los atributos del gráfico para que su gráfico tenga el aspecto que desea.

También puedes leer esta guía rápida para crear gráficos en Angular .

Estaría encantado de ayudar si necesita más consejos.