Search code examples
chartsjsfiddlec3.js

Why are the x-axis ticks not showing?


Why are the X axis ticks not showing the ticks or tick text?

https://jsfiddle.net/horacebury/2vc606wx/

I feel there is something wrong here, but not sure what:

axis: {
  x: {
    type: 'timeseries',
    tick: {
      format: '%H:%M',
      //count: 17,
      //fit: true,
      values: ['00:00','01:30','03:00','04:30','06:00','07:30','09:00','10:30','12:00','13:30','15:00','16:30','18:00','19:30','21:00','22:30','00:00']
    },

Solution

  • axis.x.tick.format is the format used for displaying the ticks, the format for parsing axis.x.tick.values can be specified as data.xFormat

    data: {
         x: 'x',
         xFormat: '%d/%m/%Y %H:%M',
         columns: [c3dates, c3originals, c3data],
         names: {
             data1: 'Power: 21 February',
             data2: 'Originals'
         },
         types: c3types,
         axes: {
             data2: 'y',
             data2: 'y2'
         }
    },
    axis: {
        x: {
            type: 'timeseries',
            tick: {
                format: '%H:%M',
                values: ['21/02/2017 01:00']
        },
        .....