Camembert avec jQuery
Je veux créer un graphique en secteurs en JavaScript. En cherchant, j'ai trouvé l'API Google Charts. Depuis que nous utilisons jQuery, j'ai constaté qu'il y avait intégration de jQuery pour Google Charts disponible.
Mais mon problème est que les données réelles sont envoyées au serveur de Google pour la création des graphiques. Existe-t-il un moyen d'empêcher l'envoi des données à Google? Je suis préoccupé par l'envoi de mes données à un tiers.
jqPlot est plutôt joli et il est open source.
Voici un lien vers les plus impressionnants et les plus récents exemples de jqPlot .
Flot
Limitations: lignes, points, zones remplies, barres, camembert et combinaisons de ceux-ci
Du point de vue de l'interaction, Flot vous rapprochera de loin du graphisme Flash, comme vous pouvez le faire avec jQuery. La sortie du graphique est plutôt lisse et belle, mais vous pouvez également interagir avec des points de données. Ce que je veux dire par là, c'est que vous pouvez survoler un point de données et obtenir un retour visuel sur la valeur de ce point dans le graphique.
La version principale de flot prend en charge les graphiques à secteurs.
Capacité Flot Zoom.
En plus de cela, vous avez également la possibilité de sélectionner une partie du graphique pour récupérer les données pour une "zone" particulière. En tant que caractéristique secondaire de ce "zonage", vous pouvez également sélectionner une zone sur un graphique et effectuer un zoom avant pour voir les points de données un peu plus près. Très cool .
Lignes d'étincelle
Limitations: Tarte, Ligne, Barre, Combinaison
Sparklines est mon mini-outil graphique préféré. Vraiment génial pour les graphiques de style tableau de bord (pensez au tableau de bord Google Analytics lors de votre prochaine connexion). Parce qu’ils sont si petits, ils peuvent être inclus dans la ligne (comme dans l’exemple ci-dessus). Une autre bonne idée qui peut être utilisée dans tous les plug-ins de création de graphiques est la capacité d’actualisation automatique. Leur démo Mouse-Speed vous montre la puissance de la cartographie en direct à son meilleur.
graphique de requête 0.21
Limitations: surface, ligne, barre et combinaisons de celles-ci
jQuery Chart 0.21 n’est pas le meilleur plugin de cartographie à ce jour, il faut le dire. Les fonctionnalités qu’il prend en charge sont assez basiques, mais elles peuvent être flexibles si vous pouvez y consacrer du temps et des efforts.
L'ajout de valeurs dans un graphique est relativement simple:
.chartAdd({
"label" : "Leads",
"type" : "Line",
"color" : "#008800",
"values" : ["100","124","222","44","123","23","99"]
});
jQchart
Limitations: Bar, Line
jQchart est un étrange, ils ont intégré des transitions d’animation et des fonctionnalités de glisser/déposer dans le graphique, mais il est un peu maladroit - et apparemment inutile. Il génère des graphiques attrayants si vous obtenez la configuration CSS correcte, mais il y a mieux.
TufteGraph
Limitations: Bar et Stacked Bar
Tuftegraph se vend comme "de jolis graphiques à barres que vous montriez à votre mère". Ca se rapproche, Flot est plus joli, mais Tufte se prête bien à être très léger. Bien que cela soit assorti de restrictions, il existe peu d'options parmi lesquelles choisir, de sorte que vous obtenez ce que vous recevez. Découvrez-le pour un graphique à barres gagnant rapide.
Des tonnes d'excellentes suggestions ici, allez juste jeter ZingChart sur la pile pour faire bonne mesure. Nous avons récemment publié un wrapper jQuery pour la bibliothèque, ce qui facilite encore la création et la personnalisation des graphiques. Les liens CDN sont dans la démo ci-dessous.
Je fais partie de l'équipe ZingChart et nous sommes ici pour répondre à toutes les questions que vous pourriez avoir!
$('#pie-chart').zingchart({
"data": {
"type": "pie",
"legend": {},
"series": [{
"values": [5]
}, {
"values": [10]
}, {
"values": [15]
}]
}
});<script src="http://cdn.zingchart.com/zingchart.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.zingchart.com/zingchart.jquery.min.js"></script>
<div id="pie-chart"></div>Un nouveau joueur sur le terrain propose des cartes de navigation avancées qui utilisent Canvas pour des animations et des performances super fluides:
Exemple de cartes:
Documentation: https://zoomcharts.com/en/javascript-charts-library/charts-packages/pie-chart/
Quel est cool à propos de cette lib:
- D'autres tranches peuvent être étendues
- Pie propose une exploration des structures hiérarchiques (voir exemple).
- écrivez facilement votre propre contrôleur de source de données ou fournissez un simple fichier json
- exporter des images haute résolution hors de la boîte
- prise en charge complète tactile , fonctionne parfaitement sur iPad, iPhone, Android, etc.
Les graphiques sont gratuits pour une utilisation non commerciale, des licences commerciales et une assistance technique sont également disponibles.
Des graphiques de temps interactifs et des graphiques en réseau sont également à votre disposition. 
Les graphiques sont fournis avec une API et des paramètres étendus, vous permettant ainsi de contrôler tous les aspects des graphiques.
Quelques autres qui n'ont pas été mentionnés:
Pour les mini-tartes, lignes et barres, Peity est brillant, simple, minuscule, rapide, utilise un balisage très élégant.
Je ne suis pas sûr de sa relation avec Flot (étant donné son nom), mais Flotr2 est assez bon, fait certainement de meilleures tartes que Flot.
Bluff produit des graphiques linéaires de belle apparence, mais j'ai eu quelques problèmes avec ses tourtes.
Ce n'est pas ce que je cherchais, mais un autre produit commercial (un peu comme Highcharts) est TeeChart .
Chart.js est très utile, car il supporte de nombreux autres types de graphiques.
Il peut être utilisé avec jQuery et sans.