1👍
✅
With a small workaround, it is possible to achieve what you want.
You need to use Chart.js plugins, which let you handle events which occur through all the chart creation (beforeInit
, afterUpdate
, afterDraw
…) and are easy to implement :
Chart.pluginService.register({
beforeInit: function(chart) {
// This will be triggered before the chart initalization
}
});
Now you just need to populate both the labels
and the data
arrays using plugins :
var fromAPI = [[[1473396905000,1.925],[1473402008000,3.8978],[1473402311000,1.3657]]];
Chart.pluginService.register({
beforeInit: function(chart) {
// We store the data -- Making it more readable
var data = chart.config.data;
// For each dataset in your array ..
for (var i = 0; i < fromAPI.length; i++) {
// For each data in your dataset ..
for (var j = 0; j < fromAPI[i].length; j++) {
// Populate the `labels` array with the first element
data.labels[j] = fromAPI[i][j][0];
// Populate the `data` array of this specific dataset with the 2nd element
data.datasets[i].data[j] = fromAPI[i][j][1];
}
}
}
});
You can see in this jsFiddle the full code, and here is its result :
Source:stackexchange.com