ChartJS coloured based on Specs
ChartJS coloured based on Specs
by pj_js15
HTML
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.2/Chart.js"></script>
<canvas id="myChart"></canvas>
JavaScript
var data = {
"type": "doughnut",
"data": {
"labels": [
"Red",
"Green",
"Yellow"
],
"datasets": [
{
"data": [57, 43, 0],
"backgroundColor": [
"#0077C0",
"#8BC63E"
]
},
{
label: "Data 2",
data: [30, 27, 10, 10, 10, 13],
backgroundColor: [
"#014990",
"#00AEEF",
"#89D3F4",
"#FAE13C",
"#F6A01B",
"#F16142"
]
}]
}/*,
options: {
animation: {
onComplete: function() {
alert(this.boxes[0].chart.options.cutoutPercentage);
alert(this.boxes[1].chart.options.cutoutPercentage);
this.boxes[0].chart.options.cutoutPercentage = 75;
this.boxes[0].options.fullWidth = false;
alert(this.boxes[0].chart.options.cutoutPercentage);
alert(this.boxes[1].chart.options.cutoutPercentage);
this.update();
}
}
}*/
};
new Chart($('#myChart'), data);