0

I'm using ArcGIS Javascript API 4.20 to retrieve a webmap from ArcGIS online, and I'm able to load and display it by providing its ID, using the following simple script:

import MapView from "https://js.arcgis.com/4.20/@arcgis/core/views/MapView.js";
import WebMap from "https://js.arcgis.com/4.20/@arcgis/core/WebMap.js";
import esriId from "https://js.arcgis.com/4.20/@arcgis/core/identity/IdentityManager.js";

var webmap = new WebMap({
    portalItem: {
    id: "1234567890qwertyuiop"
    }
});

var view = new MapView({
    map: webmap,
    container: "mapFrame", //ID of the HTML element where the map will be displayed
});

I need to find a way to programmatically adjust the map's zoom when it gets loaded, so that every layer/feature contained in it is visible in the area displayed in the map.

I've found examples and references using a "fullExtent" function, but as far as I understand this is designed to work with a layer. I've not been able to figure out how to apply the same idea to the full webmap instead and make it work: https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-FeatureLayer.html#fullExtent

webmap.when(function(){
    view.extent = webmap.fullExtent;
});

//I've tried using this. It doesn't raise any errors, but does nothing.

Could you please let me know what am I doing wrong? Or share any ideas to achieve what I need programmatically using a different approach?

Jorge Chávez
  • 50
  • 9

1 Answers1

1

WebMap does not have a fullExtent property, so that is not going to work.

I guess you are trying to have a way to dynamically set the initial extent related to some layers features. If that is the case you should calculate it using the fullExtent property of the layers involved. That should not be too hard to pull it, you can do it manually iterating on all the full extents of the layers and getting the minimal and maximal x and y, or use union method of Extent (1).

Another way to think the problem, is to use a fixed area of interest, calculate manually the extent and set it to the view. Or choose a center and play with the zoom levels.

1 - ArcGIS API - Extent union

cabesuon
  • 4,860
  • 2
  • 15
  • 24
  • I was able to iterate through the layers and use `union` to build a main extent, as you suggested. But I'm facing a problem when trying to set this new extent to my view. I'm getting the following error: `[esri.views.MapView] #center incompatible spatialReference {"wkid":102644} with view's spatialReference {"latestWkid":3857,"wkid":102100}` I've been trying to manually include the spatialReference values without success. Do you know if I'm missing something, or doing something wrong? – Jorge Chávez Nov 17 '21 at 16:47
  • So basically the error means you are trying to use a geometry with a different spatial reference that the one of the map, set by the base layer. You need to project the geometry to the spatial reference of the map. You can use a geometry service for that [ArcGIS API - GeometryService](https://developers.arcgis.com/javascript/latest/api-reference/esri-tasks-GeometryService.html#project) – cabesuon Nov 17 '21 at 21:27