2

I'm trying to set up the web map example using our portal, but nothing is actually loading

The web map is shared to public

HTML Code :

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Eletrosul test map</title>

  <style>
    html,
    body,
    #viewDiv {
      padding: 0;
      margin: 0;
      height: 100%;
      width: 100%;
    }
  </style>

  <link rel="stylesheet" href="https://js.arcgis.com/4.0/esri/css/main.css">
  <link rel="stylesheet" href="https://js.arcgis.com/4.0/esri/css/calcite/calcite.css">

  <script src="https://js.arcgis.com/4.0/"></script>

  <script>
    require([
      "esri/views/MapView",
      "esri/WebMap",
      "dojo/domReady!",
      "esri/config"
    ],function(esriConfig){
      portalUrl : "https://eletrosul.maps.arcgis.com/home"
    },function(MapView, WebMap){
      var webmap = new WebMap({
        portalItem: {
          id: "8dc6238168494f64b163c81b43baebe0"
        }
      });

      var view = new MapView({
        map: webmap,
        container: "viewDiv"
      });
    });
  </script>
</head>

<body>
  <div id="viewDiv"></div>
</body>

</html>

Our Portal (It's in Portuguese, but the link and ID checks) :

enter image description here

1

1 Answer 1

2

There are a few syntax errors in your JavaScript. First off, ArcGIS JS uses AMD style modules. You have somehow mixed two modules into one, in a weird broken way. Your imports MapView, WebMap, domReady! and config need to be present as function parameters in the first function, in the same order:

require([
  "esri/views/MapView",
  "esri/WebMap",
  "esri/config",
  "dojo/domReady!"
], function(MapView, WebMap, esriConfig, domReady){
   // your JavaScript goes here
});

Then you are assigning the portal URL in a wrong way, it should be assigned as a parameter of esriConfig, using = instead of ::

// "esriConfig" - same as in function parameter
// refers to the "esri/config" import (3rd import, 3rd parameter)
esriConfig.portalUrl = "https://myHostName.esri.com/arcgis"

Judging from other examples I found on the internet, the /home at the end of your URL should be omitted.

The complete code then looks like this:

<script>
  require([
    "esri/views/MapView",
    "esri/WebMap",
    "esri/config",
    "dojo/domReady!"
  ], function(MapView, WebMap, esriConfig, domReady){

    esriConfig.portalUrl = "https://eletrosul.maps.arcgis.com"
    var webmap = new WebMap({
      portalItem: {
        id: "8dc6238168494f64b163c81b43baebe0"
      }
    });

    var view = new MapView({
      map: webmap,
      container: "viewDiv"
    });
  });
</script>
1
  • This didn't work for me. Don't I need to log into the portal somehow? My portal uses operating system authentication so I don't even know how I would go about logging in.
    – ketar
    Commented Nov 15, 2017 at 15:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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