Reply To: Zoom Out Functionality?

[Bivek Singh]

Andrew,

Thank you for choosing CanvasJS. As of now, Zoom Out in steps is not available out of the box. It is on our road map but we don’t have a timeline for it yet. Meanwhile, you can easily achieve by programmatically changing viewportMinimum and viewportMaximum upon clicking zoom-back button. Please find the code-snippet below.

function back() {
  var viewportMinStack = chart.options.viewportMinStack;
  var viewportMaxStack = chart.options.viewportMaxStack;

  if(viewportMinStack.length > 1) {
    viewportMinStack.pop();
    viewportMaxStack.pop();
    axisX[0].viewportMinimum = viewportMinStack[viewportMinStack.length-1];
    axisX[0].viewportMaximum = viewportMaxStack[viewportMaxStack.length-1];
  }  else {
    axisX[0].viewportMinimum = null;
    axisX[0].viewportMaximum = null;
    backButton.style.visibility = "hidden";
  }

  chart.render();
}

backButton.addEventListener("click", back);

Please take a look at this JSFiddle for complete code.

—-
Bivek Singh