Chartjs-Chart.js Time series – x axis that change depending on timestamp

by

0👍

Here’s a small example you can use as a start. You will have to play with the time properties like unit, minUnit, displayFormats, min, max and so on…

I’m not a big fan of the way chart.js chooses to distribute and display the ticks.

Note: this example here does not feature a way to choose the amount of displayed data. It just displays all data you give it.

https://jsbin.com/fiyopogapa/1/edit?js,output

  scales: {
    xAxes: [{
      type: 'time',
      time: {
        minUnit: 'hour',
        displayFormats: {
          day: 'MMM D',
          week: 'MMM YYYY',
          month: 'MMM YYYY',
          quarter:  'MMM YYYY'
        }
      }
    }]
  }

Leave a comment