chart js comparison column chart example
Example 1: chart js x axis data bar
data: {
datasets: [{
barPercentage: 0.5,
barThickness: 6,
maxBarThickness: 8,
minBarLength: 2,
data: [10, 20, 30, 40, 50, 60, 70]
}]
};
Example 2: chartjs horizontal bar data in front
options: {
responsive: true,
maintainAspectRatio: false,
hover: {
animationDuration: 0
},
animation: {
duration: 1,
onComplete: function() {
let chartInstance = this.chart,
ctx = chartInstance.ctx;
ctx.textAlign = 'center';
ctx.textBaseline = 'bottom';
this.data.datasets.forEach(function(dataset, i)
{
let meta = chartInstance.controller.getDatasetMeta(i);
meta.data.forEach(function(bar, index) {
let data = dataset.data[index];
ctx.fillText(data, bar._model.x + 15 , bar._model.y + 5);
});
});
}
}
},