CODEWITHSUNDEEP
javascriptchart.js
NLAnaconda
NLAnaconda

Reputation: 1595

chart.js v2 - how to 'fill' the graph when using time scale

Im creating a chart with chart.js v2 and I have a good working graph which uses a time scaled axis. Now I want to show whole hours in the axis so I set the option like this:

xAxes: [{
    type: 'time',
    time: {
        unit: 'hour',
        unitStepSize: 1,
        displayFormats: { 'hour': 'H:mm' }
    }
}]

This works good but I have gaps at the beginning and end of the graph. enter image description here

How can I make it fit like this: enter image description here

Codepen: http://codepen.io/WilbertE/pen/wzRmWr

Upvotes: 0

Views: 2884

Answers (1)

tektiv
tektiv

Reputation: 14187

You want to use the min & max attributes of the time property :

options: {
    scales: {
        xAxes: [{
            type: "time",
            time: {
                min: /* Set your min here .. */,
                max: /* .. and your max here*/
            }
        }]
    }
}

Upvotes: 2

Related Questions