Magazine Internet

[HTML5] – pie chart (camembert)

Publié le 25 septembre 2010 par Michael
[HTML5] – pie chart (camembert)

Outil de statistique en HTML5 & Jquery

Vous souhaitez réaliser un camembert dynamique, et fluide. Vous pensez à flash, Ajax, … mais peut-être pas encore à HTML5.
Pourtant des développeurs commencent de plus en plus à s’y intéresser. La preuve des possibilités de cette nouvelle technologie qui monte sur le lien ci-dessous.

Vous allez pouvoir intégrer facilement ce graphique pour représenter les statistiques d’un site internet, … L’outil développé en HTML5 & aussi avec jQuery. L’intégration est très bien expliquée, en 14 étapes :

1. Create the markup
2. Create the CSS
3. Include the jQuery and ExplorerCanvas libraries
4. Create the main function, config settings, and useful variables
5. Initialise the chart
6. Write a click handler for the pie chart
7. Write a click handler for the table
8. Write a function to toggle a slice in or out
9. Create a function to pull a slice out
10. Create a function to animate the pull-out effect
11. Create a function to push slices back in
12. Write a function to draw the chart
13. Build a function to draw each slice in the chart
14. Create an easing function

Source : elated.com
Code source à telecharger : snazzy-animated-pie-chart-html5-jquery


Retour à La Une de Logo Paperblog

A propos de l’auteur


Michael 138 partages Voir son profil
Voir son blog

l'auteur n'a pas encore renseigné son compte l'auteur n'a pas encore renseigné son compte

Magazine