The following chart, drawn by ZingChart library, is a Simple Bar Chart.
Using our plugin, named Blazing Charts, I added the following shortcode to this post:
(left-bracket)BlazingChart charttype="zingchart" source="zingchart-sample-1"(right bracket)
The first parameter specifies which charting library is used. The second parameter is the slug of a Custom Post Type, named Chart Snippets, introduced by that plugin.
The source of the script for the drawing is added as plain text to a Chart Snippet. The content of the chart snippet for the above chart is as following:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <div id="chartDiv" style="direction: ltr;"></div> <script> var chartData = { "type":"bar", // Specify your chart type here. "series" : [ // Insert your series data here. {"values":[5,20,15,25,10]} ] }; window.onload = function(){ // Render Method[2] zingchart.render({ id:'chartDiv', data:chartData, height:400, width:600 }); }; </script> |
<div id="chartDiv" style="direction: ltr;"></div> <script> var chartData = { "type":"bar", // Specify your chart type here. "series" : [ // Insert your series data here. {"values":[5,20,15,25,10]} ] }; window.onload = function(){ // Render Method[2] zingchart.render({ id:'chartDiv', data:chartData, height:400, width:600 }); }; </script>