Smart number of labels on categorical axis

plotly.js
1

Hello,

I noticed that using the default axis type plotly is clever enough to display a reasonable amount of axis labels based on the available space.

I would like to achieve the same using a categorical axis, but what I see is that as soon as I switch to a categorical axis using type: 'category' what happens as that all labels are displayed.

I know this can be customized manually using the various axis configuration options, but I’m wondering if there’s a way to simply achieve the same behavior that plotly applies on a non-categorical axis instead.

2

Not at the moment. It’s not obvious to me how autorange for category axes would work. Any thoughts on this?

3

That’s my conclusion as well. I came up with a simplified approach which dynamically sets the nticks property of the xaxis based on the available horizontal space. Say I want to have 100px allocated to each label, I do something like this:

const {width} = containerDomNode.getBoundingClientRect()

layout.xaxis.nticks = Math.floor(width / 100)

This obviously doesn’t take into account the lengths of the labels, but it’s a reasonable compromise between outcome and simplicity in my case.