CODEWITHSUNDEEP
d3.jsc3.js
Abhinaw Kumar Singh
Abhinaw Kumar Singh

Reputation: 105

C3js - How to set category label on axis marker

I am using c3js to draw a line chart. x-axis displaying labels, which is rendered in between axis marker. It is using axis.x.type : 'category'. otherwise the lines are not creating.

But I want to display it on x-axis marker, not in between them.

here is sample code

var chart = c3.generate({
    data: {
       x:'xaxis',
       columns: [
          ['xaxis','cat1', 'cat2', 'cat3', 'cat4', 'cat5', 'cat6', 'cat7', 'cat8', 'cat9'],
          ['data1', 30, 200, 100, 400, 150, 250, 50, 100, 250]
       ]
   },
    axis: {
       x: {
        type: 'category'
      }
  }
});

Here is sample code on jsfiddle https://jsfiddle.net/abhinaw/kyjgzd62.

Is there a way to do this?

Thanks

Upvotes: 1

Views: 261

Answers (1)

Dmitry Demidovsky
Dmitry Demidovsky

Reputation: 8197

Use axis.x.tick.centered option:

axis: {
  x: {
    tick: {
      centered: true
    }
  }
}

See updated fiddle.

Upvotes: 1

Related Questions