Create Web map

View live sample

Description

This sample shows how to use esri.arcgis.utils.createWebMap to create a map using an object that is a by value representation of the webmap.This is an alternative to other samples in this folder that create a map using the webmap id from ArcGIS.com. The code below creates a new webmap and sets the title, description and initial extent of the map.

   
    var webmap = {};
    webmap.item = {
      "title":"Soil Survey Map of USA",
      "snippet": "Detailed description of data",
      "extent": [[-139.4916, 10.7191],[-52.392, 59.5199]]
    }; 
  

Next, the layers that make up the map are defined. In this sample, the World Terrain basemap from ArcGIS.com is added along with an overlay layer that adds additional information to the map such as boundaries, cities, water features and landmarks and roads. An operational layer is added that displays soil information from the U.S. Department of Agriculture.

    webmap.itemData = {
    "operationalLayers": [{
      "url": "http://server.arcgisonline.com/ArcGIS/rest/services/Specialty/Soil_Survey_Map/MapServer",
      "visibility": true,
      "opacity": 0.75,
      "title": "Soil Survey Map",
      "itemId": "204d94c9b1374de9a21574c9efa31164"
    }],
    "baseMap": {
      "baseMapLayers": [{
        "opacity": 1,
        "visibility": true,
        "url": "http://services.arcgisonline.com/ArcGIS/rest/services/World_Terrain_Base/MapServer"
        },{
        "isReference": true,
        "opacity": 1,
        "visibility": true,
        "url": "http://services.arcgisonline.com/ArcGIS/rest/services/Reference/World_Reference_Overlay/MapServer"
        }],
      "title": "World_Terrain_Base"
    },
    "version": "1.1"
  };

  

Note: You can retrieve the item definition from an ArcGIS.com item using esri.arcgis.utils.getItem()

Once the webmap is created, we'll use the createMap method to build a map from the provided information.

  var mapDeferred = esri.arcgis.utils.createMap(webmap, "map", {
    mapOptions: {
      slider: true
    },
    geometryServiceURL: "http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer"
  });

Code