Secondary Axis and negative values

• February 24, 2025 at 12:58 pm #60605
  
  mrDavid

  Hello,
  If I have negative values in a chart with a secondary axis, then the Y Axis do not align at 0
  https://jsfiddle.net/mx74fkvg/

  It was suggested on the general forum that setting a minimum value can resolve the issue.
  Like this https://jsfiddle.net/ngtmLrqz/

  However this requires calculating the interval & number of intervals. This is quite a burden to emulate

  Can issue be fixed?

  thanks

  February 25, 2025 at 6:31 pm #60610
  
  Manoj Mohan

  @mrdavid,

  Aligning the zero value across multiple y-axes is not available as an inbuilt feature as of now. However, you can align it by setting minimum, maximum and interval of the axes dynamically as shown in the code snippet below.

  
  var allAxes = [...chart.axisY, ...chart.axisY2];
  
  allAxes.forEach(axisInstance => {
    var initialMin = axisInstance.get("minimum");
    var initialMax = axisInstance.get("maximum");
    var initialInterval = axisInstance.get("interval");
  
    var newMin, newMax;
  
    if (initialMin >= 0) {
      newMin = (-initialMax * desiredFraction) / (1 - desiredFraction);
      newMax = initialMax;
    } else if (initialMax <= 0) {
      newMin = initialMin;
      newMax = (initialMin * (desiredFraction - 1)) / desiredFraction;
    } else {
      newMin = Math.min(
        initialMin,
        (-initialMax * desiredFraction) / (1 - desiredFraction)
      );
      newMax = (-newMin * (1 - desiredFraction)) / desiredFraction;
  
      // Ensure newMax doesn't undershoot data
      if (newMax < initialMax) {
        newMax = initialMax;
        newMin = (-newMax * desiredFraction) / (1 - desiredFraction);
      }
    }
  
    // Update axis values & re-render
    axisInstance.set("minimum", newMin, false);
    axisInstance.set("maximum", newMax, false);
    axisInstance.set("interval", initialInterval);
  });

  Also check out this JSFiddle for the complete working code.

  

  —-
  Manoj Mohan
  Team CanvasJS

  March 1, 2025 at 11:15 am #60633
  
  mrDavid

  @Manoj,

  That works great. Thankyou for the detailed solution