score:3

Accepted answer

You can control what you are asking for with a combination of tickInterval and min on the yaxis as demonstrated in this jsfiddle mock up.

EDIT

In your code while reading in the XML you will have to keep track of what the lowest value is and also the highest value on the sales side. Then decide how you want to display those values if they meet a certain value. After that use if statements to set the values. Here is a couple of examples.

Low less than -50 and greater -90
With High less than 400
Primary Axis: min: -2, tickInterval: 1,
Secondary Axis: min: -100, tickInterval: 50

Example

Low less than -50 and greater -90
With High greater than 400
Primary Axis: min: -1, tickInterval: 1,
Secondary Axis: min: min: -100, tickInterval: 100,

Example

To figure out what the min on the Primary Axis should be you simply divide the min on the Secondary Axis by its tickInterval. Then the tickInterval for the Primary Axis would always be 1.

score:0

You can also calculate second axis tick positions based on the max series value related to this axis and the first axis ticks positions to get the same amount of ticks and 0 line shared.

Using axis.update() method update tick positions in the second axis using property tickPositions.

Example with a load event. Notice, that when you add points dynamically you have to make those calculations and update tick positions each time your first axis ticks will change:

  chart: {
    type: 'column',
    events: {
      load: function() {
        var chart = this,
          yAxis = this.yAxis,
          max = yAxis[1].dataMax,
          positiveTicksAmount = 0,
          negativeTicksAmount = 0,
          tickPositions = [],
          tickInterval,
          min,
          i;

        yAxis[0].tickPositions.forEach(function(tick) {
          if (tick > 0) {
            positiveTicksAmount++;
          } else if (tick < 0) {
            negativeTicksAmount++;
          }
        });

        tickInterval = max / positiveTicksAmount;

        for (i = negativeTicksAmount; i > 0; i--) {
          tickPositions.push(-tickInterval * i);
        }

        for (i = 0; i <= positiveTicksAmount; i++) {
          tickPositions.push(
            tickInterval * i
          );
        }

        yAxis[1].update({
          tickPositions: tickPositions
        });
      }
    }
  },

Jsfiddle examples:
https://jsfiddle.net/wchmiel/84q0sxrt/
http://jsfiddle.net/wchmiel/nuj7fagh/

Api reference:
https://api.highcharts.com/class-reference/Highcharts.Axis#update
https://api.highcharts.com/highcharts/yAxis.tickPositions


Related Query

More Query from same tag