score:22

*Accepted answer*

I ended up finding a way to do this through configuration after digging even further into the Highcharts API. Each axis has a configuration option called `tickPositioner`

for which you provide a function which returns an array. This array contains the exact values where you want ticks to appear on the axis. Here is my new `tickPositioner`

configuration, which places five ticks on my Y axis, with zero neatly in the middle and the max at both extremes :

```
yAxis: {
tickPositioner: function () {
var maxDeviation = Math.ceil(Math.max(Math.abs(this.dataMax), Math.abs(this.dataMin)));
var halfMaxDeviation = Math.ceil(maxDeviation / 2);
return [-maxDeviation, -halfMaxDeviation, 0, halfMaxDeviation, maxDeviation];
},
...
}
```

score:0

Just in case someone is searching,

One option more. I ended up in a similar situation. Follows my solution:

```
tickPositioner: function () {
var dataMin,
dataMax = this.dataMax;
var positivePositions = [], negativePositions = [];
if(this.dataMin<0) dataMin = this.dataMin*-1;
if(this.dataMax<0) dataMax = this.dataMax*-1;
for (var i = 0; i <= (dataMin)+10; i+=10) {
negativePositions.push(i*-1)
}
negativePositions.reverse().pop();
for (var i = 0; i <= (dataMax)+10; i+=10) {
positivePositions.push(i)
}
return negativePositions.concat(positivePositions);
},
```

score:0

It is an old question but recently I have had the same problem, and here is my solution which might be generalized:

```
const TICK_PRECISION = 2;
const AXIS_MAX_EXPAND_RATE = 1.2;
function setAxisTicks(axis, tickCount) {
// first you calc the max from the data, then multiply with 1.1 or 1.2
// which can expand the max a little, in order to leave some space from the bottom/top to the max value.
// toPrecision decide the significant number.
let maxDeviation = (Math.max(Math.abs(axis.dataMax), Math.abs(axis.dataMin)) * AXIS_MAX_EXPAND_RATE).toPrecision(TICK_PRECISION);
// in case it is not a whole number
let wholeMaxDeviation = maxDeviation * 10 ** TICK_PRECISION;
// halfCount will be the tick counts on each side of 0
let halfCount = Math.floor(tickCount / 2);
// look for the nearest larger number which can mod the halfCount
while (wholeMaxDeviation % halfCount != 0) {
wholeMaxDeviation++;
}
// calc the unit tick amount, remember to divide by the precision
let unitTick = (wholeMaxDeviation / halfCount) / 10 ** TICK_PRECISION;
// finally get all ticks
let tickPositions = [];
for (let i = -halfCount; i <= halfCount; i++) {
// there are problems with the precision when multiply a float, make sure no anything like 1.6666666667 in your result
let tick = parseFloat((unitTick * i).toFixed(TICK_PRECISION));
tickPositions.push(tick);
}
return tickPositions;
}
```

So in your chart axis tickPositioner you may add :

```
tickPositioner: function () {
return setAxisTicks(this, 7);
},
```

score:1

You can do this with the getExtremes and setExtremes methods

- http://api.highcharts.com/highcharts#Axis.getExtremes%28%29
- http://api.highcharts.com/highcharts#Axis.setExtremes%28%29

example:

http://jsfiddle.net/jlbriggs/j3NTM/1/

```
var ext = chart.yAxis[0].getExtremes();
```

score:1

Here is my solution. The nice thing about this is that you can maintain the `tickInterval`

.

```
tickPositioner(min, max) {
let { tickPositions, tickInterval } = this;
tickPositions = _.map(tickPositions, (tickPos) => Math.abs(tickPos));
tickPositions = tickPositions.sort((a, b) => (b - a));
const maxTickPosition = _.first(tickPositions);
let minTickPosition = maxTickPosition * -1;
let newTickPositions = [];
while (minTickPosition <= maxTickPosition) {
newTickPositions.push(minTickPosition);
minTickPosition += tickInterval;
}
return newTickPositions;
}
```

score:3

I know this is an old post, but thought I would post my solution anyway (which is inspired from the one macserv suggested above in the accepted answer) as it may help others who are looking for a similar solution:

```
tickPositioner: function (min, max) {
var maxDeviation = Math.ceil(Math.max(Math.abs(this.dataMax), Math.abs(this.dataMin)));
return this.getLinearTickPositions(this.tickInterval, -maxDeviation, maxDeviation);
}
```

Source: stackoverflow.com

#### Related Query

- Highcharts - Keep Zero Centered on Y-Axis with Negative Values
- Highcharts - best way to handle and display zero (or negative) values in a line chart series with logarithmic Y axis
- Highcharts - Column With Negative Values - Column Color
- Highcharts - Issue with negative values when displaying multiple axes
- HighCharts scatter plot with Datetime on X Axis not plotting values correctly
- Highcharts - Area Chart - Stacking with series containing negative and positive values
- Highcharts - Cannot set x-axes categories in column charts with negative values
- Column chart with negative values and categories on xAxis in HighCharts
- Highcharts - Pie chart with negative values
- highcharts gauge use with negative values
- Y axis values merging with candles in highcharts
- nGradient effect with negative values on highcharts
- Display negative Y values above zero instead below in highcharts
- highchart axis position with negative values
- Highcharts - Stacked Bar Column - Total Value of Stacked Bar not Correct with Negative and Positive Values
- Highcharts - set maximum range for yAxis but keep axis dynamic within that range
- Highcharts - with datetime axis labels overlap
- highcharts - removing decimal places on Y axis with only one point
- Highcharts blank chart with x and y axis
- Highcharts label format with tickPositioner in a datetime x Axis
- highcharts zero values results in graph half way instead at the bottom
- Highcharts Line - When Y axis min is set to 0, connecting line isn't shown for consecutive 0 values
- Highcharts How to get decimal point values on y-axis with big numbers
- How to show only specific x-axis values on datetime axis in Highcharts
- Highcharts - Global configuration with common code and unique data & Headings
- How to populate a Highcharts axis with string formatted data from a PHP array
- Highcharts: having trouble recreating stacked area chart from Excel with positive and negative values
- Highcharts Solid Gauge with min number NOT zero
- how to pass values to tooltip which not in x and y axis in highcharts
- Highcharts line with null values

#### More Query from same tag

- How to tell the Highcharts renderer to make the viewport bigger?
- Update tickposition on zoom
- how to create a column char with highcharts where each column has a different color
- High charts Tool tip is not supporting in IE10 and IE8 and Mozilla with more data
- Highcharts - How to change display data and remove mouseover?
- How to change color of bar in column chart with different level of percentage in highcharts
- Highcharter: Keep the selected Zoom when updating a stock plot
- Spline Graph with diagonally fixed values with 0,0 and ploting remaing same
- Three level drill down highmap
- Highcharts - CUSTOM DATA LABELS in line series, are disappearing on window resize
- Some xAxis labels are not showing in Highchart : Area Chart
- Highcharts Data Point Image
- Updating a Highchart from a form with a click() event in jquery
- X axis tick not centering on column series in highcharts (jsFiddle)
- How can I add a "for" in a Highcharts series?
- Adding a JSON Response to a HighCharts Graph
- Highchart - tooltip for legends
- HighCharts Column Overlapping
- web page is hanging while loading from DB and large data not showing on charts in asp.net mvc5
- Want to set the y axis ticks to a fixed value Highcharts
- Date and time wrong on Highstock chart
- Highcharts - Is there a way to disble styled mode for certain elements?
- js highcharts, having problems creating the chart series
- Highcharts: disable allowPointSelect for only one pie slice
- Highcharts remove labels after chart creation / drilldown
- How to concatenate 'this.name' with HighCharts & PhantomJS
- Highcharts stacked bar data
- How to assign .POST return value to a variable
- Highcharts - tickInterval not working for bar/column charts
- Javascript chart component that can handle annotated news headlines