zoomType: String

zoomType allows you to control the axis for which zooming and panning are enabled. Default is “x” which enables zooming across xAxis. You can customize this to allow zooming/panning on yAxis or both xAxis and yAxis by setting zoomType to “y” or “xy”.

Default: “x”
Options: “x”, “y”, “xy”

Notes
  • This property works only when zoomEnabled is set to true.
  • Applies only for Chart types which have Axis.


var  chart =  new  CanvasJS.Chart("container",
{
 .
 .
 zoomEnabled: true, 
 zoomType: "xy"
 .
 . 
});

chart.render();


Values generated from a random generator.
Try it Yourself by Editing the Code below.



If you have any questions, please feel free to ask in our forums.Ask Question

Comments 9

  1. Pingback: In v1.8 you can Sync multiple chart ranges, zoom vertically and control Pie/Doughnut Chart size - CanvasJS

  2. Please add some textual notification for zoom and pan so that user can get to know that there’s a zoom option is enabled. As of now there’s no indication like this so end user can’t use until unless someone will give the guidelines to use.

    With Warm Regards,

  3. Pingback: CanvasJS Chart 1.8.0 goes GA - CanvasJS

  4. Hi CanvasJS Team, XY Zooming is not functioning properly when we have disabled the tooltip… The Zoom area selection box (the semi transparent box) goes over the title or axis label and when releasing nothing happens…

    • Arun,

      Thanks for reporting this issue. We will fix the problem as earliest as possible and get back to you.

  5. zoomtype xy is not working as expected. is there any restriction on the usage? like, the selection range mush span across at least 3 intervals or 3 data points?

    to repro, modify the limit to show only 4 data points, selecting any 2 or 3 of them won’t trigger any zooming.

If you have any questions, please feel free to ask in our forums. Ask Question