Overview

You will learn: how to export a static image of a map with the ArcGIS Export Map Service.

The ArcGIS Export Map Service is a geoprocessing service that can generate a static image for a web map. If you would like to integrate a map into your application, you can use ArcGIS REST API and the Export Web Map Task to assemble the map on the fly and export an image file. All you need to do is provide a web map and define the output image type, and the file will be created and hosted so it can be retrieved afterwards. Additional web map properties can be added to style the map further with items such as graphics and layers. To learn more about the capabilities, please visit the documentation.

In this lab you will use the ArcGIS REST API to access the ArcGIS Export Map Service to create a static image of a map with a basemap, a custom graphic, and a layer representing trailheads.

Before you begin

Install Postman to execute HTTP requests. Go to this lab if you need an access token.

Steps

Create a request to access the export map service

  1. Open Postman and click [+] in the tab bar to create a new request.

  2. In the new tab, set the following:

    • HTTP Method: POST
    • Request URL: https://utility.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export Web Map Task/execute

Add parameters to define the image format and layout

  1. Click on Body and add the following Key/Value pairs:

    • f: json
    • Format: PNG32
    • Layout_Template: MAP_ONLY

Add parameters to define a simple web map

  1. In the Body, add the following parameter to define the extent and the basemap:

    • Web_Map_as_JSON:
    {
      "mapOptions": {
        "extent": {
          "xmin": -118.85360990096176,
          "ymin": 33.99062491328014,
          "xmax": -118.75318799544432,
          "ymax": 34.04042561067984,
          "spatialReference": {
            "wkid": 4326
          }
        }
      },
      "operationalLayers": [],
      "baseMap" : {
        "title" : "Topographic Basemap",
        "baseMapLayers" :  [
          {
            "url" : "https://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"
          }
        ]
      },
      "exportOptions": {
        "outputSize" :  [600,400]
      }
    }
    

Execute the requst to create the image

  1. Click Send to run the request.

  2. In the response window, change the view to JSON. It should look something like this:

    {
    "results": [
        {
            "paramName": "Output_File",
            "dataType": "GPDataFile",
            "value": {
                "url": "https://utility.arcgisonline.com/arcgis/rest/directories/arcgisoutput/Utilities/PrintingTools_GPServer/_ags_4d4faf4c6b1d4cfba42d24f4b1b84c93.png"
            }
        }
    ],
    "messages": []
    }
    
  3. Find the image's URL in the results array.

  4. Click on the URL and then Send to preview your images before proceeding to the next step.

Update the parameters to add a custom graphic to the map

  1. In the Body, update the Web_Map_as_JSON with the JSON below.

    {
      "mapOptions": {
        "extent": {
          "xmin": -118.85360990096176,
          "ymin": 33.99062491328014,
          "xmax": -118.75318799544432,
          "ymax": 34.04042561067984,
          "spatialReference": {
            "wkid": 4326
          }
        }
      },
      "operationalLayers": [
        {
          "opacity":0.35,
          "featureCollection": {
            "layers": [
              {
                "layerDefinition": {
                  "name": "pointLayer",
                  "geometryType": "esriGeometryPoint",
                  "drawingInfo": {
                    "renderer": {
                      "type": "simple",
                      "symbol": {
                        "type": "esriSMS",
                        "style": "esriSMSCircle",
                        "color": [
                          255,
                          165,
                          194,
                          255
                        ],
                        "size": 50,
                        "outline": {
                          "color": [
                            255,
                            48,
                            144,
                            255
                          ],
                          "width": 3
                        }
                      }
                    }
                  }
                },
                "featureSet": {
                  "features": [
                    {
                      "geometry": {
                        "x": -118.80619999999999,
                        "y": 34.00167000000005,
                        "spatialReference": {
                          "wkid": 4326
                        }
                      }
                    }
                  ]
                }
              }
            ]
          }
        }
      ],
      "baseMap" : {
        "title" : "Topographic Basemap",
        "baseMapLayers" :  [
          {
            "url" : "https://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"
          }
        ]
      },
      "exportOptions": {
        "outputSize" :  [600,400]
      }
    }
    
  2. Click Send to run the request. You can find the URL to your image in the results array in the response.

  3. Click on the URL and Send to preview your images before you proceed to the next step.

Update the parameters to add a feature layer

  1. Update the Web_Map_as_JSON parameter with the JSON below to add the trailheads feature layer. This defines a second layer in the operationalLayers key.

    {
      "mapOptions": {
        "extent": {
          "xmin": -118.85360990096176,
          "ymin": 33.99062491328014,
          "xmax": -118.75318799544432,
          "ymax": 34.04042561067984,
          "spatialReference": {
            "wkid": 4326
          }
        }
      },
      "operationalLayers": [
        {
          "opacity":0.35,
          "featureCollection": {
            "layers": [
              {
                "layerDefinition": {
                  "name": "pointLayer",
                  "geometryType": "esriGeometryPoint",
                  "drawingInfo": {
                    "renderer": {
                      "type": "simple",
                      "symbol": {
                        "type": "esriSMS",
                        "style": "esriSMSCircle",
                        "color": [
                          255,
                          165,
                          194,
                          255
                        ],
                        "size": 50,
                        "outline": {
                          "color": [
                            255,
                            48,
                            144,
                            255
                          ],
                          "width": 3
                        }
                      }
                    }
                  }
                },
                "featureSet": {
                  "features": [
                    {
                      "geometry": {
                        "x": -118.80619999999999,
                        "y": 34.00167000000005,
                        "spatialReference": {
                          "wkid": 4326
                        }
                      }
                    }
                  ]
                }
              }
            ]
          }
        },
        {
          "url":"https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trailheads/FeatureServer/0",
          "opacity":1,
          "layerDefinition":{
            "drawingInfo":{
              "renderer":{
                "type":"simple",
                "symbol":{
                  "angle":0,
                  "xoffset":0,
                  "yoffset":0,
                  "type":"esriPMS",
                  "url":"http://static.arcgis.com/images/Symbols/NPS/npsPictograph_0231b.png",
                  "imageData":"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",
                  "contentType":"image/png",
                  "width":10.5,
                  "height":10.5
                }
              }
            }
          }
        }
      ],
      "baseMap" : {
        "title" : "Topographic Basemap",
        "baseMapLayers" :  [
          {
            "url" : "https://services.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"
          }
        ]
      },
      "exportOptions": {
        "outputSize" :  [600,400]
      }
    }
    
  2. Click Send to run the request. You can find the URL to your image in the results array in the response. Preview your images before you proceed to the next step.

  1. In Postman click Code below the Send button. Select a programming language and use Postman to generate sample code for your application to run this request.

Congratulations, you're done!

You have successfully created a static image of a map with graphics and a feature layer.

Challenge

Explore the ExportWebMap specification

Explore the ExportWebMap specification and customize your map by including more values in the Web_Map_as_JSON parameter.