topic JS 4.3: mapview initial extent in ArcGIS JavaScript Maps SDK Questions

JS 4.3: mapview initial extent

PaulYoum1 — Tue, 16 May 2017 21:11:49 GMT

I'm using the ESRI Javascript API for 4.3 and my MapView is not respecting the initial extents of what I'm trying to set as the initial extents. I can change the extents after the map loads, but this does some snap zooming after the map loads which feels wrong. Am I missing something? Here is my basic map:

require([
"esri/Map",
"esri/views/MapView",
"esri/layers/FeatureLayer",
"esri/layers/MapImageLayer",
"esri/Basemap",
"dojo/domReady!"
], function (Map, MapView, FeatureLayer, MapImageLayer, Basemap) {

    var roadLayer = new MapImageLayer({
        url: a basemap service
    });

    var map = new Map({
        layers: "topo"
    });

    var view = new MapView({
        container: "mapDiv", // Reference to the scene div created in step 5
        map: map, // Reference to the map object created before the scene
        zoom: 5, // Sets the zoom level based on level of detail (LOD)
        center: [ -122.3321, 47.6062 ] // Sets the center point of view in lon/lat
    });

map.add(roadLayer);

});

Re: JS 4.3: mapview initial extent

RobertScheitlin__GISP — Wed, 17 May 2017 13:11:05 GMT

Paul,

You are using a cached base map (topo) which is only cached at certain scales for the map will only display at those LODs (levels of display) that is why is seems like the map snaps to a certain extent (because it does).

Re: JS 4.3: mapview initial extent

PaulYoum1 — Fri, 19 May 2017 14:25:36 GMT

Thanks Robert.So I've adjusted the zoom level to be something within the LOD of the basemap, and it still seems to default at the max view envelope, bypassing the things I put in my map view. For instance it looks like:

Re: JS 4.3: mapview initial extent

KristianEkenes — Sat, 11 Dec 2021 21:56:48 GMT

Paul,

Try setting the `snapToZoom` property in MapView.constraints to false: MapView | API Reference | ArcGIS API for JavaScript 4.5

var view = new MapView({
  container: "mapDiv",
  map: map,
  zoom: 5,  // this can be a decimal number
  center: [ -122.3321, 47.6062 ],
  constraints: {
    snapToZoom: false
  }
});‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Let me know if this resolves your issue.