prêt à l'emploi graphique dynamique d3.js

Question

J'évalue changer les graphiques je généré à ce jour à l'aide highcharts.js à d3.js

juste pour le plaisir et je veux apprendre comment fonctionne d3.js. Je me demande s'il y a quelque chose de similaire à l'url ci-dessous (voir si vous cliquez sur une tarte, il vous donne de nouvelles données), quelque chose de dynamique et prêt à utiliser (ou à ne pas implémenter à partir de zéro).

Ce que je veux atteindre, plus ou moins ...

http://lully.snv.jussieu.fr/gbif/mapping/graphs/examples/pie-legend.htm

merci à l'avance

Pere

Answer 1

Si vous voulez remplacer Highcharts, je pense que la seule bonne ouvert La bibliothèque de diagrammes Novus de Bob Monteverde est actuellement disponible en option: http://novus.github.com/nvd3/. NVD3 a un joli camembert et a aussi de bonnes légendes. Jetez un oeil à tous les tableaux de cette bibliothèque et vous verrez ce que je veux dire. Vous pouvez également trouver un bon graphique circulaire dans le tutoriel de Stephen Boak: http://blog.stephenboak.com/2011/08/07/easy-as-a-pie.html. Une autre option intéressante est de chercher les questions de Frank Guerino sur le groupe google google D3. J'utiliserais NVD3 si j'étais vous. Il pourrait avoir besoin de quelques ajustements, mais il semble être la meilleure option actuellement. Bonne chance!

Answer 2

Fonction simple pour générer des diagrammes circulaires utilisant d3.js. Cette fonction fait partie du projet http://xhprof.io/. Il est capable de gérer des ensembles de données de taille arbitraire. Il a plusieurs options qui permettent la personnalisation, telles que la marge d'étiquette, le rayon de cercle et la visibilité des données de pourcentage (référez-vous au code source).

La démo est disponible à https://dev.anuary.com/858b33b7-bd66-507b-a9f1-533e4de79ba3/. Le code source est disponible au https://github.com/gajus/pie-chart.