Nivo: Controlling Axis Increments

Created on 16 Oct 2018 · 8Comments · Source: plouc/nivo

Is there a way to control axis increments?

For instance I have a chart that tracks assets, in the chart there are 2 bars, one that has a value of 1 and the other has a value of 2. However the axis displays 0, 0.5, 1, 1.5 and 2. As there is no such thing as 1.5 assets this doesn't work for us. Is there a way to limit the axis to whole numbers only?

Source

mattmuirheadDauntless

Most helpful comment

I've created a demo, just in case => https://codesandbox.io/s/1zoxoj5q5j

plouc on 16 Oct 2018

👍4

All 8 comments

you can pass explicit values, or compute the number of ticks you'd like to have.

plouc on 16 Oct 2018

Thanks for the quick reply @plouc - can you point me in the right direction in the documentation? I can't find any examples on how to do this?

mattmuirheadDauntless on 16 Oct 2018

You can have a look at http://nivo.rocks/guides/axes#ticks, in your case you could use tickValues: 3 or tickValues: [0, 1, 2] for example.

plouc on 16 Oct 2018

👍4

And also it depends on the package you use, I've not plugged all components on the new axes package.

plouc on 16 Oct 2018

Excellent thanks @plouc

mattmuirheadDauntless on 16 Oct 2018

I've created a demo, just in case => https://codesandbox.io/s/1zoxoj5q5j

plouc on 16 Oct 2018

👍4

Is it possible to show y axis grid lines only on those whole numbers and not the fractions? I have a chart with data points that can only ever be whole numbers, and I’d like to make the y axis grid lines adhere to that and not show the lines in between.