How to create stunning charts with chart.js

More and more works show easier with charts like PPT.  The API called chart.js is a responsive plugin to convert the statics to different types of charts.

The Github address

The full documents address

Step1:
Download the chart.js file from Github above address and link to the body section.
Or
Link from online library  https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js

In case the browser's version is lower than IE8 ,adding the code below to convert the canvas to VML.
<!--[if lte IE 8]>
<script src="excanvas.js"></script>
<![endif]-->
Step2:
HTML layout. I got each type of charts of a canvas.
html

Step3:
Javascript 
Bulid the data with label and datasets and set two line charts.
js
Grab the canvas from HTML and draw the charts with type and data.


js
And another data source called piedata.
js

Other five types of charts.

The total charts types are line.pie,bar,radar,doughnut and polarArea.




Popular posts from this blog

Fancyapps — easily build overlay windows with carousel

Meet Mantine: A TS-Based Open-Source React Components Library

Meet Tippy.js: The Complete Tooltip Popover Plugin