topic Re: Unable to zoom in beyond zoom level 16 - ArcGIS API for JS in ArcGIS JavaScript Maps SDK Questions

Unable to zoom in beyond zoom level 16 - ArcGIS API for JS

PaulMcCord — Sun, 12 Dec 2021 05:08:54 GMT

Hello,

I'm creating a map application using the ArcGIS API for JS v4.11. I'm running into an issue where I can't zoom closer than zoom level 16. I've applied constraints to my MapView, which I've called myView:

//Constrain the max and min zoom levels
    myView.constraints = {
        minZoom: 13,
        maxZoom: 19
    };‍‍‍‍‍

The minZoom is being honered... I can't zoom out further than zoom level 13, but I can't zoom in to 19.

I don't know if it makes a difference, but I'm using a custom basemap that I created using the Vector Tile Style Editor: ArcGIS Vector Tile Style Editor

Is there any additional configuration I need to do if using a custom basemap? Here's how I bring in the custom basemap:

//Create the main map, starting with a custom basemap
    var basemap = new Basemap({
        baseLayers: [
            new VectorTileLayer({
                portalItem: {
                    id: "ddef64bb74174dd6adf7cff46dd24da7"
                }
            })
        ],
        title: "customBM",
        id: "customBM"
    });‍‍‍‍‍‍‍‍‍‍‍‍

Thanks,

Paul

Re: Unable to zoom in beyond zoom level 16 - ArcGIS API for JS

Egge-Jan_Pollé — Sun, 12 Dec 2021 05:08:57 GMT

Hi Paul McCord,

Yes, I do see what you mean.

I replicated your case - see full code below.

Using your basemap (having LODs 0-22) I manage to get it working with ArcGIS API for JS v4.16. With that version it is perfectly possible to limit zooming between levels 13 an 19 -> try the example below.

But as soon as I downgrade to 4.11 I encounter the same issue: no zooming beyond level 16. Weird...

So, the question is: do you really have to stuck with version 4.11?

HTH,

Egge-Jan

<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
  <title>ArcGIS JavaScript Tutorials: zoom constraints</title>
  <link rel="stylesheet" href="https://js.arcgis.com/4.16/esri/css/main.css">
  <script src="https://js.arcgis.com/4.16/"></script>
  <style>
    html, body, #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
    #location {
      padding: 15px;
      background: white;
      color: black;
       border: 5px solid gold;
       font-family: sans-serif;
       font-size: 1.2em;
    }
  </style>
  <script>
    require([
      "esri/Map",
      "esri/Basemap",
      "esri/views/MapView",
      "esri/layers/VectorTileLayer",
      "esri/core/watchUtils"
    ], function(Map, Basemap, MapView, VectorTileLayer, watchUtils) {

      var map = new Map({
        basemap: new Basemap({
          baseLayers: [
            new VectorTileLayer({
              portalItem: {
                id: "ddef64bb74174dd6adf7cff46dd24da7"
              }
            })
          ],
          title: "customBM",
          id: "customBM"
        })
      });

      var view = new MapView({
        container: "viewDiv",
        map: map,
        center: [-73.966667, 40.783333], // longitude, latitude
        zoom: 15
      });

      //Constrain the max and min zoom levels
      view.constraints = {
        minZoom: 13,
        maxZoom: 19
      };
      
      view.ui.add("location", "bottom-left");

      watchUtils.whenTrue(view, "stationary", function() {
        lon = parseInt(view.center.x); // with parseInt values are rounded to the full meter (coordinates in Web Mercator - EPSG:3857)
        lat = parseInt(view.center.y);
        zoomLevel = view.zoom;
        document.getElementById("location").innerHTML = "Map Center - Longitude: " + lon + " / Latitude: " + lat + " / Zoom level: " + zoomLevel; 
      });
    });
  </script>
</head>
<body>
  <div id="viewDiv"></div>
  <div id="location"></div>
</body>
</html>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Unable to zoom in beyond zoom level 16 - ArcGIS API for JS

PaulMcCord — Sun, 26 Jul 2020 00:45:33 GMT

Great! Thank you Egge-Jan. I don't need to stick with v4.11. I've now upgraded to 4.16 and it is working as it should. Thanks for the assistance!

Paul

Re: Unable to zoom in beyond zoom level 16 - ArcGIS API for JS

AmitAnand — Tue, 19 Oct 2021 10:57:29 GMT

Facing similar issue baseMap.initialExtent is setting different zoom level in 4.18 and different in 3.x in older UI it was working fine but after recent update we are facing this issue.