Restrict panning extents api 3.5 to 4.10

JasonDavenport — Wed, 27 Feb 2019 14:51:24 GMT

I found some javascript api 3.5 code on the internet that I have been trying to convert to 4.10 without success. I do admit that I am fairly new to the api and don't know if it is doable in 4.10.

I'm trying to restrict users from panning and zooming outside the extents of the map area that I assign to them.

Here is a working version I found using 3.5: http://jsfiddle.net/gh/gist/library/pure/6050806/

Thanks!

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>Simple Map</title>
    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/css/esri.css">
    <style>
      html, body, #map {
        height:100%;
        width:100%;
        margin:0;
        padding:0;
      }
      body {
        background-color:#FFF;
        overflow:hidden;
        font-family:"Trebuchet MS";
      }
    </style>
    <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/"></script>
    <script>
      dojo.require("esri.map");
      var map = null;
      var extent = null;
      var maxExtent = null;

      function init() {
        map = new esri.Map("map",{
          basemap:"topo",
          center:[-122.45,37.75], //long, lat
          zoom:13,
          sliderStyle:"small"
        });
        //set max extent to inital extent
        dojo.connect(map, "onLoad", function(){
         maxExtent = map.extent;
        });

        //check to see if map is within max extent when its extent changes. If not, roll back to the max
        //extent that we set above
        dojo.connect(map, "onExtentChange", function(extent){
          if((map.extent.xmin < maxExtent.xmin) ||
            (map.extent.ymin < maxExtent.ymin) ||
            (map.extent.xmax > maxExtent.xmax) ||
            (map.extent.ymax > maxExtent.ymax)
            ) {
            map.setExtent(maxExtent);
            console.log("max extent reached, rolling back to previous extent");
          }

      });

      }

      dojo.ready(init);

</script>
</head>

Re: Restrict panning extents api 3.5 to 4.10

RobertScheitlin__GISP — Wed, 27 Feb 2019 15:01:18 GMT

Jason,

See this thread:

https://community.esri.com/thread/229431-getting-mapview-to-stay-within-bounds

Re: Restrict panning extents api 3.5 to 4.10

JasonDavenport — Wed, 27 Feb 2019 16:24:33 GMT

Perfect! I just changed it to x,y min and x,y max. I do wish there was a way to mask everything outside the view extents.

Thanks for the quick reply.

topic Re: Restrict panning extents api 3.5 to 4.10 in ArcGIS Server with JavaScript API Questions

Restrict panning extents api 3.5 to 4.10

Re: Restrict panning extents api 3.5 to 4.10

Re: Restrict panning extents api 3.5 to 4.10