I am trying to plot a series of measurements (indexed by timestamps). When I try to plot example date the xaxis ranges from 1970 until 2018, although the data only exists in 2018-12.
What setting does scale the xaxis correctly?
document.addEventListener("DOMContentLoaded", function(event) {
var ctx = document.getElementById("plot").getContext('2d');
var myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ["Value"],
datasets: [{
'label': 'Value',
'data': [
{t: '2018-12-01T12:00:00', y: 100},
{t: '2018-12-02T12:00:00', y: 90},
{t: '2018-12-03T12:00:00', y: 85},
{t: '2018-12-04T12:00:00', y: 86},
{t: '2018-12-05T12:00:00', y: 77},
{t: '2018-12-06T12:00:00', y: 73},
{t: '2018-12-07T12:00:00', y: 72},
{t: '2018-12-08T12:00:00', y: 70},
{t: '2018-12-15T12:00:00', y: 71},
{t: '2018-12-16T12:00:00', y: 72},
{t: '2018-12-17T12:00:00', y: 69},
],
'fill': false,
}],
},
options: {
responsive: true,
title: {
display: true,
text: 'foobar',
},
scales: {
xAxes: [{
type: 'time',
display: true,
time: {
parser: "YYYY-MM-DDTHH:mm:ss",
},
}]
},
},
});
});
type: 'time',
display: true,
time: {
parser: "YYYY-MM-DDTHH:mm:ss",
},
You can add in scale > xAxes > time according to ChartJS And you can use also add time format of MomentJS
type: 'time',
display: true,
distribution: 'series',
time: {
unit:"year",
displayFormats:{year:'YYYY'},
min:'1970' ,
max:'2018',
}
I don't know if this will help you, but when I tried to add a date "2017/02/29", the x-axis also goes back to 1970, because there were only 28 days in Feb 2017!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With