Chartjs timeaxis problem with #4658
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script>
<script src="https://rawgit.com/nagix/nagix.github.io/chartjs/Chart.4658.js"></script>
<canvas id="myChart" width="400" height="300"></canvas>
<hr>
<br>
<br>
<h2>
Plotted Daily with offset = true
</h2>
<canvas id="myChart_daily" width="400" height="300"></canvas>
JavaScript
const CHART_COLORS = ['rgba(58, 186, 50, 1)', 'rgba(16, 208, 231, 1)']
function generate_ds(keys, data, colors) {
let result = [];
for (let idx = 0; idx < keys.length; idx++) {
let color = colors[idx];
let obj = {
label: keys[idx],
backgroundColor: color,
borderColor: color,
data: data[idx],
fill: false,
radius: 30
}
result.push(obj);
}
return result
}
function mapProp(obj, property) {
return obj.map(_ => _[property]);
}
let url = 'https://api.myjson.com/bins/9evr5'
$.ajax({
type: 'GET',
url: url,
contentType: "application/json",
dataType: 'json',
success: function(data) {
var ctx = document.getElementById("myChart").getContext("2d");
var ctx_daily = document.getElementById("myChart_daily").getContext("2d");
let result_by_month = data.map(item => ({
date: moment(item['date']).format('MMM, YYYY'),
impact: item.impact,
opportunity: item.opportunity
}));
let rbm_obj = {};
result_by_month.forEach(el => {
rbm_obj[el.date] = rbm_obj[el.date] || {};
rbm_obj[el.date].impact = rbm_obj[el.date].impact || [];
rbm_obj[el.date].opportunity = rbm_obj[el.date].opportunity || [];
rbm_obj[el.date].impact.push(el.impact);
rbm_obj[el.date].opportunity.push(el.opportunity);
})
let impact_daily = [];
let opp_daily = [];
for (let obj of data) {
impact_daily.push(obj['impact']);
opp_daily.push(obj['opportunity']);
}
let impact = [];
let opp = [];
for (let obj of Object.values(rbm_obj)) {
impact.push(obj.impact.reduce((acc, curr) => acc + curr))
opp.push(obj.opportunity.reduce((acc, curr) => acc + curr))
}
let labels = ['Label A', 'Label B']
let ds = generate_ds(labels, [impact_daily, opp_daily], CHART_COLORS)
let ds1 = generate_ds(labels, [impact, opp], CHART_COLORS);
let chart_data_monthly = {
labels: Object.keys(rbm_obj),
datasets: ds1
...