How to set a limit for zoom in / out feature?

Hi There

I try to set a limit for zoom in / out, the purpose of this is to stop the chart looks too small / big in the container.

I try to find a event for zoom in / out only, but I only can find a example using event “plotly_relayout”. So all relayout action will trigger this event not only zoom in / out. Also I am not sure how to do a min/max zoom level check or calculation, is there any existing function / event I can use to solve this problem.


This might help you get started.

Hi etienne
Thanks for you suggestion, but I still not sure what’s the best way to stop relayout (zoom in / zoom out). Inside the relayout event callback function, the resize action is already done.
any suggestion?


Hello there!
I can tell you what i do, it’s not a perfect solution because i haven’t find a way to stop relayout if the zoom level is too low or too hight.
In the event object i get the max and min values of the x axis and do the relayout again:
var update = {‘xaxis.range’: [min_val, max_val]};
Plotly.relayout(“placeholder”, update);

Thanks Narghast, that could be a solution :slight_smile:

Hi. I used the technique below. Therefore, I can dynamically set the minimum zoom level

 var initialCountries = [ Set( =>];
    var initialLat= 55.4414;
    var initialLon= 65.3181;
    var initialZoom = 2;

    if (initialCountries.length === 1){
      initialLat = markerPoints[0].lat;
      initialLon = markerPoints[0].lon;
      initialZoom = 3; 

    var zoom_level = e['mapbox.zoom'];
    if (zoom_level < initialZoom){
      layout.mapbox.zoom = initialZoom = {lat: initialLat, lon: initialLon}
      Plotly.relayout(myPlot, layout)