Basic Column Chart - CanvasJS JavaScript Charts

Basic Column Chart - CanvasJS JavaScript Charts

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 900px; width: 830px;"></div>

JavaScript

var data = [{ yValueFormatString: "#0", y: 411, label : ""},{ yValueFormatString: "#0", y: 5828, label : "Good"},{ yValueFormatString: "#0", y: 15759, label : "Moderate"},{ yValueFormatString: "#0", y: 1868, label : "Poor"},{ yValueFormatString: "#0", y: 230, label : "Moribund"},{ yValueFormatString: "#0", y: 360, label : "Dead"},{ yValueFormatString: "#0", y: 39, label : "Pollard"},{ yValueFormatString: "#0", y: 68, label : "Pollard (Scheduled)"},{ yValueFormatString: "#0", y: 1, label : "Pollard (Riverbank)"},{ yValueFormatString: "#0", y: 2, label : "Good (Low Vitality)"},{ yValueFormatString: "#0", y: 491, label : "Moderate (Low Vitality)"},{ yValueFormatString: "#0", y: 576, label : "Felled"},{ yValueFormatString: "#0", y: 70, label : "Lapsed Pollard"},{ yValueFormatString: "#0", y: 164, label : "Stump"},{ yValueFormatString: "#0", y: 6, label : "Damaged (Vandalism)"},{ yValueFormatString: "#0", y: 4, label : "Damaged (Other)"}]

var myNewChart = new CanvasJS.Chart("chartContainer", {title:{text: "Condition", fontSize: 15},  axisX:{labelFontSize: 12, valueFormatString: "#0"}, exportEnabled: true, data: [{type: "pie", indexLabel: "{label}, {y}", indexLabelFontSize: 5, dataPoints: data}]});

myNewChart.render();