0

I am trying to display an ArcGIS Map on my webpage.

Whenever I try to use the 'extent' Attribute next to the 'center' and 'zoom' Attributes, I get the following error:

GET https://js.arcgis.com/4.8/esri/SpatialReference.js net::ERR_ABORTED 404

So apparently the SpatialReference.js can not be loaded, but is a part of the ArcGIS API.

Am I misunderstanding something?

I have my code from https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#using where the use of 'extent' is explained.

<code>
<script src="https://js.arcgis.com/4.8/"></script>
// ...
require([
            "esri/views/MapView",
            "esri/geometry/Extent",
            "esri/SpatialReference",
            "esri/WebMap",
            "dojo/domReady!"
        ], function (MapView, WebMap, Extent, SpatialReference) {
            var webmap = new WebMap({portalItem: { id: "f7f....."}});
            var view = new MapView({
                map: webmap,
                container: "mapdiv",
                center: [7.16809, 51.94349],
                zoom: 14 
            });
            // Set the extent on the view
            view.extent = new Extent({
                xmin: -9177882,
                ymin: 4246761,
                xmax: -9176720,
                ymax: 4247967,
                spatialReference: new SpatialReference({ wkid: 102667 })
            });
        }); 
</code>
3

There are couple of issues in your code, but not too bad.

It's esri/geometry/SpatialReference not esri/SpatialReference. https://developers.arcgis.com/javascript/latest/api-reference/esri-geometry-SpatialReference.html

Plus the order matters when you require the modules, you had a couple of modules out of order.

require([
  "esri/views/MapView",
  "esri/geometry/Extent",
  "esri/geometry/SpatialReference",
  "esri/WebMap",
  "dojo/domReady!"
], function(MapView, Extent, SpatialReference, WebMap

Also because of autocasting in the API, you don't need to initialize all those classes.

require([
  "esri/views/MapView",
  "esri/WebMap",
], function(MapView, WebMap) {
  var webmap = new WebMap({portalItem: { id: "f7f....."}});
  var view = new MapView({
    map: webmap,
    container: "viewDiv",
    center: [7.16809, 51.94349],
    zoom: 14
  });
  // Set the extent on the view
  view.extent = {
    xmin: -9177882,
    ymin: 4246761,
    xmax: -9176720,
    ymax: 4247967,
    spatialReference:{ wkid: 102667 }
  };
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.