van.nguyen
Posts: 7
Joined: Mon Oct 31, 2022 7:51 am

How to make Highcharts ticks distributed evenly no matter what the tick values are

I created a bar chart with some chart options with Highcharts React
https://codesandbox.io/s/highchart-bar- ... cks-c6mi5p
The ticks are not distributed evenly. Is there any way to make them even regardless of their values?

Image

I expect to find an option from Highcharts
kamil.k
Posts: 458
Joined: Thu Oct 06, 2022 12:49 pm

Re: How to make Highcharts ticks distributed evenly no matter what the tick values are

Hello van.nguyen,

Welcome to our forum and thanks for contacting us with your question.

For that purpose, you should not use the tickPositions property, because it defines what ticks should be displayed, not where. Instead, I would suggest using the yAxis.labels.formatter property to directly define ticks values. You can read more about it here:
https://api.highcharts.com/highcharts/y ... .formatter

Let me know if that is what you were looking for.

Best regards!
Kamil Kubik
Highcharts Developer
van.nguyen
Posts: 7
Joined: Mon Oct 31, 2022 7:51 am

Re: How to make Highcharts ticks distributed evenly no matter what the tick values are

Thanks kamil.k,

Your solution works brilliantly in JavaScript, but I just wonder how I can get it work with highcharts-export-server.
To explain the case, I want to send the chart options as a JSON object to the export server, so I cannot pass a formatter callback function to it. Is there any alternative option in this case?

Regards!
kamil.k
Posts: 458
Joined: Thu Oct 06, 2022 12:49 pm

Re: How to make Highcharts ticks distributed evenly no matter what the tick values are

You're welcome!

Since the v2.1.0 of node-export-server, you need to define the --allowCodeExecution flag when starting the server to make callbacks work. You can read about the updates here: https://github.com/highcharts/node-expo ... es-in-v210.

Let me know if the solution works for you,
Regards!
Kamil Kubik
Highcharts Developer

Return to “Highcharts Usage”