Tutorial: Display a simple static map | Documentation

Learn how to use the ArcGIS Static Maps serviceThe ArcGIS Static Maps service, also known as Static Maps service, is a location service hosted by Esri that generates non-interactive map images called static maps. The service supports displaying a variety of basemap styles and optional geometries such as points, polylines, and polygons. No client-side mapping API is required.Learn more to generate a static mapA static map is a non-interactive map image generated by the ArcGIS Static Maps service that includes a basemap style and optional geometries such as points, polylines, and polygons.Learn more with GET requests.

Examples of static maps with a point, multiple points, a polyline, and a polygon graphic.

In this tutorial, you use the /with-point, /with-many-points, /with-polyline, and /with-polygon endpoints from the ArcGIS Static Maps service to generate four simple static maps. You also learn how to use default marker symbols and customize the image size and output format.

Prerequisites

You need an ArcGIS Location Platform account to get an access tokenAn access token is an authorization string that provides access to secure ArcGIS content, data, and services. Its capabilities are determined by the privileges it supports. It is obtained by implementing API key authentication, User authentication, or App authentication.Learn more to access the Static Maps service.

Steps

Get an access token

Create a new API key credentialAPI key credentials are an item that contains the parameters used to create and manage long-lived access tokens for API key authentication. They are a type of developer credential.Learn more with privilegesPrivileges are a set of permissions assigned to ArcGIS accounts, developer credentials, and applications that grant access to secure resources and functionality in ArcGIS.Learn more to access the resources used in this tutorial.

If you are familiar with API keys, create an API key credential with the following configurations:
- Type of application: Public application
- Required privileges: Location services > Static maps
If you are new to API keys, go to the Create an API key tutorial for full step-by-step instructions.
When prompted, copy and paste the API key to a safe location. It will be used in the next step.

Display a static map with a point

The /with-point endpoint supports GET operations to generate a static map with a point with a default symbol.

Define the /with-point endpoint and set the basemap style to arcgis/navigation-night. The URL should look like this:
Use dark colors for code blocksCopy
```
1
https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point
```
Send a GET request to generate the static map, including the following query parameters:
- x to -0.127758.
- y to 51.507351.
- radius to 1000.
- symbolStyle to pin.
- symbolColor to FFFFFF.
- symbolScale to 2.
- symbolLabel to A.
- padding to [0,20,0,0].
- width and height to 600.
- format to jpeg.
- token to your access token.
HTTPHTTPcURL
Use dark colors for code blocksCopy
```
1
2
GET /arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point?x=-0.127758&y=51.507351&radius=1000&symbolStyle=pin&symbolColor=FFFFFF&symbolScale=2&symbolLabel=A&width=600&height=600&format=jpeg&padding=[0,20,0,0]&token=YOUR_ACCESS_TOKEN HTTP/1.1
Host: static-maps-api.arcgis.com
```
Run in Postman
You should see a static map centered on Central London, with a white pin symbol labeled A and 20 pixels of padding on the right. You can also view the static map in a browser and replace YOUR_ACCESS_TOKEN with your access token.

In your HTML file, create an <img> element and set its src attribute to the URL of the static map with a point, including its parameters.

x to -0.127758.
y to 51.507351.
radius to 1000.
symbolStyle to pin.
symbolColor to FFFFFF.
symbolScale to 2.
symbolLabel to A.
padding to [0,20,0,0].
width and height to 600.
format to jpeg.
token to your access token.

HTML
Use dark colors for code blocksCopy
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Static map with a point</title>
  </head>
  <body>
    <img
      src="https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point?x=-0.127758&y=51.507351&radius=1000&symbolStyle=pin&symbolColor=FFFFFF&symbolScale=2&symbolLabel=A&width=600&height=600&format=jpeg&padding=[0,20,0,0]&token=YOUR_ACCESS_TOKEN"
      alt="Static map centered on London with a labeled point"
    />
  </body>
</html>

You should see a static map centered on Central London, with a white pin symbol labeled A and 20 pixels of padding on the right.

Define the /with-point endpoint and set the basemap style to arcgis/navigation-night. The URL should look like this:
Use dark colors for code blocksCopy
```
1
https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point
```
Set the following query parameters:
- x to -0.127758.
- y to 51.507351.
- radius to 1000.
- symbolStyle to pin.
- symbolColor to FFFFFF.
- symbolScale to 2.
- symbolLabel to A.
- padding to [0,20,0,0].
- width and height to 600.
- format to jpeg.

Include your access token in the Authorization header using the Bearer authentication scheme.

JavaScript
Use dark colors for code blocks

const params = new URLSearchParams({
  x: "-0.127758",
  y: "51.507351",
  radius: "1000",
  symbolStyle: "pin",
  symbolColor: "FFFFFF",
  symbolScale: "2",
  symbolLabel: "A",
  padding: "[0,20,0,0]",
  width: "600",
  height: "600",
  format: "jpeg",
});

const url = `https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point?${params}`;

Use fetch with the GET method to send the request. Then, handle the responses.

JavaScript
Use dark colors for code blocks

const params = new URLSearchParams({
  x: "-0.127758",
  y: "51.507351",
  radius: "1000",
  symbolStyle: "pin",
  symbolColor: "FFFFFF",
  symbolScale: "2",
  symbolLabel: "A",
  padding: "[0,20,0,0]",
  width: "600",
  height: "600",
  format: "jpeg",
});

const url = `https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point?${params}`;

fetch(url, {
  method: "GET",
  headers: {
    Authorization: "Bearer YOUR_ACCESS_TOKEN",
  },
})
  .then((response) => {
    if (response.status === 200) {
      return response.blob();
    }
  })
  .then((data) => {
    console.log(data);
  });

You should see a static map centered on Central London, with a white pin symbol labeled A and 20 pixels of padding on the right.

Import the following libraries at the top of your Python code.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

Define the /with-point endpoint and set the basemap style to arcgis/navigation-night.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point"

Set the query parameters and include your access token in the header as a bearer token.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point"

headers = {
    "Authorization": f"Bearer YOUR_ACCESS_TOKEN",
    "Content-Type": "application/json"
}

params = {
    "x": "-0.127758",
    "y": "51.507351",
    "radius": "1000",
    "symbolStyle": "pin",
    "symbolColor": "FFFFFF",
    "symbolScale": "2",
    "symbolLabel": "A",
    "padding": "[0,20,0,0]",
    "width": "600",
    "height": "600",
    "format": "jpeg"
}

Send the request using requests.get() and pass in the headers and parameters, then display the output image.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation-night/with-point"

headers = {
    "Authorization": f"Bearer YOUR_ACCESS_TOKEN",
    "Content-Type": "application/json"
}

params = {
    "x": "-0.127758",
    "y": "51.507351",
    "radius": "1000",
    "symbolStyle": "pin",
    "symbolColor": "FFFFFF",
    "symbolScale": "2",
    "symbolLabel": "A",
    "padding": "[0,20,0,0]",
    "width": "600",
    "height": "600",
    "format": "jpeg"
}

response = requests.get(url, headers=headers,params=params)

if response.status_code == 200:
    img = Image.open(BytesIO(response.content))
    img.show()
else:
    print("Request failed:", response.text)

You should see a static map centered on Central London, with a white pin symbol labeled A and 20 pixels of padding on the right.

Display a static map with multiple points

The /with-many-points endpoint supports GET operations to generate a static map with multiple points (up to 10 points) with default symbols.

Define the /with-many-points endpoint and set the basemap style to arcgis/streets. The URL should look like this:
Use dark colors for code blocksCopy
```
1
https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points
```
Send a GET request to generate the static map, including the following query parameters:
- points to [[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]
- symbolStyle to circle
- labelOption to number
- symbolScale to 1
- symbolColor to 007AC2
- width and height to 400
- format to png
- padding to [10]
- token to your access token.
HTTPHTTPcURL
Use dark colors for code blocksCopy
```
1
2
GET /arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points?points=[[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]&symbolStyle=circle&labelOption=number&symbolScale=1&symbolColor=007AC2&width=400&height=400&format=png&padding=[10]&token=YOUR_ACCESS_TOKEN HTTP/1.1
Host: static-maps-api.arcgis.com
```
Run in Postman
You should see a static map centered on several points in San Diego, California, with numbered circular markers displayed at each location. You can also view the static map in a browser and replace YOUR_ACCESS_TOKEN with your access token.

In your HTML file, create an <img> element and set its src attribute to the URL of the static map with multiple points, including its parameters.

points to [[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]
symbolStyle to circle
labelOption to number
symbolScale to 1
symbolColor to 007AC2
width and height to 400
format to png
padding to [10]
token to your access token.

HTML
Use dark colors for code blocksCopy
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Static map with multiple points</title>
  </head>
  <body>
    <img
      src="https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points?points=[[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]&symbolStyle=circle&labelOption=number&symbolScale=1&symbolColor=007AC2&width=400&height=400&format=png&padding=[10]&token=YOUR_ACCESS_TOKEN"
      alt="Static map with multiple points in San Diego"
    />
  </body>
</html>

You should see a static map centered on several points in San Diego, California, with numbered circular markers displayed at each location.

Define the /with-many-points endpoint and set the basemap style to arcgis/streets. The URL should look like this:
Use dark colors for code blocksCopy
```
1
https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points
```
Set the following parameters:
- points to [[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]
- symbolStyle to circle
- labelOption to number
- symbolScale to 1
- symbolColor to 007AC2
- width and height to 400
- format to png
- padding to [10]

Include your access token in the Authorization header using the Bearer authentication scheme.

JavaScript
Use dark colors for code blocks

const params = new URLSearchParams({
  points:
    "[[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]",
  symbolStyle: "circle",
  labelOption: "number",
  symbolScale: "1",
  symbolColor: "007AC2",
  width: "400",
  height: "400",
  format: "png",
  padding: "[10]",
});

const url = `https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points?${params}`;

Use fetch with the GET method to send the request. Then, handle the responses.

JavaScript
Use dark colors for code blocks

const params = new URLSearchParams({
  points:
    "[[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]",
  symbolStyle: "circle",
  labelOption: "number",
  symbolScale: "1",
  symbolColor: "007AC2",
  width: "400",
  height: "400",
  format: "png",
  padding: "[10]",
});

const url = `https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points?${params}`;

fetch(url, {
  method: "GET",
  headers: {
    Authorization: "Bearer YOUR_ACCESS_TOKEN",
  },
})
  .then((response) => {
    if (response.status === 200) {
      return response.blob();
    }
  })
  .then((data) => {
    console.log(data);
  });

You should see a static map centered on several points in San Diego, California, with numbered circular markers displayed at each location.

Import the following libraries at the top of your Python code.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

Define the /with-many-points endpoint and set the basemap style to arcgis/streets.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points"

Set the query parameters and include your access token in the header as a bearer token.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points"

headers = {
    "Authorization": f"Bearer YOUR_ACCESS_TOKEN",
    "Content-Type": "application/json"
}

params = {
    "points": "[[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]",
    "symbolStyle": "circle",
    "labelOption": "number",
    "symbolScale": "1",
    "symbolColor": "007AC2",
    "padding": "[10]",
    "width": "400",
    "height": "400",
    "format": "png"
}

Send the request using requests.get() and pass in the headers and parameters, then display the output image.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/streets/with-many-points"

headers = {
    "Authorization": f"Bearer YOUR_ACCESS_TOKEN",
    "Content-Type": "application/json"
}

params = {
    "points": "[[-117.1601,32.7055],[-117.1570,32.7076],[-117.1643,32.7039],[-117.1643,32.7099]]",
    "symbolStyle": "circle",
    "labelOption": "number",
    "symbolScale": "1",
    "symbolColor": "007AC2",
    "padding": "[10]",
    "width": "400",
    "height": "400",
    "format": "png"
}

response = requests.get(url, headers=headers, params=params)

if response.status_code == 200:
    img = Image.open(BytesIO(response.content))
    img.show()
else:
    print("Request failed:", response.text)

You should see a static map centered on several points in San Diego, California, with numbered circular markers displayed at each location.

Display a static map with a polyline

The /with-polyline endpoint supports GET operations to generate a static map with a polyline with up to 10 vertices and default symbols for the start and end points.

Define the /with-polyline endpoint and set the basemap style to arcgis/navigation. The URL should look like this:
Use dark colors for code blocksCopy
```
1
https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline
```
Send a GET request to generate the static map, including the following query parameters:
- polyline to [[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]
- startSymbolStyle to circle
- endSymbolStyle to pin
- width to 400
- height to 400
- format to png
- padding to [25]
- lineColor to 007AC2
- symbolScale to 0.75
- startSymbolColor to 35AB46
- endSymbolColor to F36F21
- token to your access token.
HTTPHTTPcURL
Use dark colors for code blocksCopy
```
1
2
GET /arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline?polyline=[[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]&startSymbolStyle=circle&endSymbolStyle=pin&width=400&height=400&format=png&padding=[25]&lineColor=007AC2&symbolScale=0.75&startSymbolColor=35AB46&endSymbolColor=F36F21&token=YOUR_ACCESS_TOKEN HTTP/1.1
Host: static-maps-api.arcgis.com
```
Run in Postman
You should see a static map with a line that represents a route in San Diego, California. The route is drawn as a blue line with a green circle marking the start and an orange pin marking the end. You can also view the static map in a browser and replace YOUR_ACCESS_TOKEN with your access token.

In your HTML file, create an <img> element and set its src attribute to the URL of the static map with a polyline, including its parameters.

polyline to [[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]
startSymbolStyle to circle
endSymbolStyle to pin
width to 400
height to 400
format to png
padding to [25]
lineColor to 007AC2
symbolScale to 0.75
startSymbolColor to 35AB46
endSymbolColor to F36F21
token to your access token.

HTML
Use dark colors for code blocksCopy
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Static map with a polyline</title>
  </head>
  <body>
    <img
      src="https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline?polyline=[[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]&startSymbolStyle=circle&endSymbolStyle=pin&width=400&height=400&format=png&padding=[25]&lineColor=007AC2&symbolScale=0.75&startSymbolColor=35AB46&endSymbolColor=F36F21&token=YOUR_ACCESS_TOKEN"
      alt="Static map showing a polyline route in San Diego"
    />
  </body>
</html>

You should see a static map with a line that represents a route in San Diego, California. The route is drawn as a blue line with a green circle marking the start and an orange pin marking the end.

Define the /with-polyline endpoint and set the basemap style to arcgis/navigation. The URL should look like this:
Use dark colors for code blocksCopy
```
1
https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline
```
Set the following parameters:
- polyline to [[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]
- startSymbolStyle to circle
- endSymbolStyle to pin
- width to 400
- height to 400
- format to png
- padding to [25]
- lineColor to 007AC2
- symbolScale to 0.75
- startSymbolColor to 35AB46
- endSymbolColor to F36F21

Include your access token in the Authorization header using the Bearer authentication scheme.

JavaScript
Use dark colors for code blocks

const params = new URLSearchParams({
  polyline:
    "[[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]",
  startSymbolStyle: "circle",
  endSymbolStyle: "pin",
  width: "400",
  height: "400",
  format: "png",
  padding: "[25]",
  lineColor: "007AC2",
  symbolScale: "0.75",
  startSymbolColor: "35AB46",
  endSymbolColor: "F36F21",
});

const url = `https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline?${params}`;

Use fetch with the GET method to send the request. Then, handle the responses.

JavaScript
Use dark colors for code blocks

const params = new URLSearchParams({
  polyline:
    "[[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]",
  startSymbolStyle: "circle",
  endSymbolStyle: "pin",
  width: "400",
  height: "400",
  format: "png",
  padding: "[25]",
  lineColor: "007AC2",
  symbolScale: "0.75",
  startSymbolColor: "35AB46",
  endSymbolColor: "F36F21",
});

const url = `https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline?${params}`;

fetch(url, {
  method: "GET",
  headers: {
    Authorization: "Bearer YOUR_ACCESS_TOKEN",
  },
})
  .then((response) => {
    if (response.status === 200) {
      return response.blob();
    }
  })
  .then((data) => {
    console.log(data);
  });

You should see a static map with a line that represents a route in San Diego, California. The route is drawn as a blue line with a green circle marking the start and an orange pin marking the end.

Import the following libraries at the top of your Python code.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

Define the /with-polyline endpoint and set the basemap style to arcgis/navigation.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline"

Set the query parameters and include your access token in the header as a bearer token.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline"

headers = {
    "Authorization": f"Bearer YOUR_ACCESS_TOKEN",
    "Content-Type": "application/json"
}

params = {
    "polyline": "[[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]",
    "startSymbolStyle": "circle",
    "endSymbolStyle": "pin",
    "width": "400",
    "height": "400",
    "format": "png",
    "padding": "[25]",
    "lineColor": "007AC2",
    "symbolScale": "0.75",
    "startSymbolColor": "35AB46",
    "endSymbolColor": "F36F21"
}

Send the request using requests.get() and pass in the headers and parameters, then display the output image.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/navigation/with-polyline"

headers = {
    "Authorization": f"Bearer YOUR_ACCESS_TOKEN",
    "Content-Type": "application/json"
}

params = {
    "polyline": "[[-117.1604,32.7067],[-117.1642,32.7090],[-117.1637,32.7096],[-117.1637,32.7115],[-117.1556,32.7115],[-117.1556,32.7085]]",
    "startSymbolStyle": "circle",
    "endSymbolStyle": "pin",
    "width": "400",
    "height": "400",
    "format": "png",
    "padding": "[25]",
    "lineColor": "007AC2",
    "symbolScale": "0.75",
    "startSymbolColor": "35AB46",
    "endSymbolColor": "F36F21"
}

response = requests.get(url, headers=headers, params=params)

if response.status_code == 200:
    img = Image.open(BytesIO(response.content))
    img.show()
else:
    print("Request failed:", response.text)

You should see a static map with a line that represents a route in San Diego, California. The route is drawn as a blue line with a green circle marking the start and an orange pin marking the end.

Display a static map with a polygon

The /with-polygon endpoint supports GET operations to generate a static map with a single-part polygon with up to 10 vertices.

Define the /with-polygon endpoint and set the basemap style to arcgis/imagery. The URL should look like this:
Use dark colors for code blocksCopy
```
1
https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon
```
Send a GET request to generate the static map, including the following query parameters:
- polygon to [[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]
- fillColor to d2b600b8
- fillStyle to solid
- outlineColor to f0d000fc
- outlineStyle to solid
- outlineWidth to 3
- width to 400
- height to 400
- format to png
- zoom to 14
- token to your access token.
HTTPHTTPcURL
Use dark colors for code blocksCopy
```
1
2
GET /arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon?fillColor=d2b600b8&fillStyle=solid&format=png&height=400&width=400&outlineColor=f0d000fc&outlineStyle=solid&outlineWidth=3&polygon=[[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]&zoom=14&token=YOUR_ACCESS_TOKEN HTTP/1.1
Host: static-maps-api.arcgis.com
```
Run in Postman
You should see a static map with a polygon in the Esri Headquarters in Redlands, California. The polygon is filled with a semi-transparent color and outlined with a solid border. You can also view the static map in a browser and replace YOUR_ACCESS_TOKEN with your access token.

In your HTML file, create an <img> element and set its src attribute to the URL of the static map with a polygon, including its parameters.

polygon to [[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]
fillColor to d2b600b8
fillStyle to solid
outlineColor to f0d000fc
outlineStyle to solid
outlineWidth to 3
width to 400
height to 400
format to png
zoom to 14
token to your access token.

HTML
Use dark colors for code blocksCopy
<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Static map with a polygon</title>
  </head>
  <body>
    <img
      src="https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon?fillColor=d2b600b8&fillStyle=solid&format=png&height=400&width=400&outlineColor=f0d000fc&outlineStyle=solid&outlineWidth=3&polygon=[[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]&zoom=14&token=YOUR_ACCESS_TOKEN"
      alt="Static map with a polygon in Redlands"
    />
  </body>
</html>

You should see a static map with a polygon in the Esri Headquarters in Redlands, California. The polygon is filled with a semi-transparent color and outlined with a solid border.

Define the /with-polygon endpoint and set the basemap style to arcgis/imagery. The URL should look like this:
Use dark colors for code blocksCopy
```
1
https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon
```
Set the following parameters:
- polygon to [[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]
- fillColor to d2b600b8
- fillStyle to solid
- outlineColor to f0d000fc
- outlineStyle to solid
- outlineWidth to 3
- width to 400
- height to 400
- format to png
- zoom to 14

Include your access token in the Authorization header using the Bearer authentication scheme.

JavaScript
Use dark colors for code blocks

const params = new URLSearchParams({
  fillColor: "d2b600b8",
  fillStyle: "solid",
  outlineColor: "f0d000fc",
  outlineStyle: "solid",
  outlineWidth: "3",
  format: "png",
  height: "400",
  width: "400",
  polygon:
    "[[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]",
  zoom: "14",
});

const url = `https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon?${params}`;

Use fetch with the GET method to send the request. Then, handle the responses.

JavaScript
Use dark colors for code blocks

const params = new URLSearchParams({
  fillColor: "d2b600b8",
  fillStyle: "solid",
  outlineColor: "f0d000fc",
  outlineStyle: "solid",
  outlineWidth: "3",
  format: "png",
  height: "400",
  width: "400",
  polygon:
    "[[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]",
  zoom: "14",
});

const url = `https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon?${params}`;

fetch(url, {
  method: "GET",
  headers: {
    Authorization: "Bearer YOUR_ACCESS_TOKEN",
  },
})
  .then((response) => {
    if (response.status === 200) {
      return response.blob();
    }
  })
  .then((data) => {
    console.log(data);
  });

You should see a static map with a polygon in the Esri Headquarters in Redlands, California. The polygon is filled with a semi-transparent color and outlined with a solid border.

Import the following libraries at the top of your Python code.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

Define the /with-polygon endpoint and set the basemap style to arcgis/imagery.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon"

Set the query parameters and include your access token in the header as a bearer token.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon"

headers = {
    "Authorization": f"Bearer YOUR_ACCESS_TOKEN",
    "Content-Type": "application/json"
}

params = {
    "fillColor": "d2b600b8",
    "fillStyle": "solid",
    "outlineColor": "f0d000fc",
    "outlineStyle": "solid",
    "outlineWidth": "3",
  "format": "png",
  "height": "400",
  "width": "400",
    "polygon": "[[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]",
  "zoom": "14"
}

Send the request using requests.get() and pass in the headers and parameters, then display the output image.

Python
Use dark colors for code blocks

import requests
from PIL import Image
from io import BytesIO

url = "https://static-maps-api.arcgis.com/arcgis/rest/services/static-maps-service/v1/static-maps/arcgis/imagery/with-polygon"

headers = {
    "Authorization": f"Bearer YOUR_ACCESS_TOKEN",
    "Content-Type": "application/json"
}

params = {
    "fillColor": "d2b600b8",
    "fillStyle": "solid",
    "outlineColor": "f0d000fc",
    "outlineStyle": "solid",
    "outlineWidth": "3",
  "format": "png",
  "height": "400",
  "width": "400",
    "polygon": "[[-117.1999995,34.0592131],[-117.1999781,34.0556133],[-117.1940236,34.0556666],[-117.192425,34.0573377],[-117.1915345,34.0572843],[-117.191513,34.0576488],[-117.1956114,34.0593998],[-117.1956222,34.0592131],[-117.1999995,34.0592131]]",
  "zoom": "14"
}

response = requests.get(url, headers=headers, params=params)

if response.status_code == 200:
  img = Image.open(BytesIO(response.content))
  img.show()
else:
  print("Request failed:", response.text)

You should see a static map with a polygon in the Esri Headquarters in Redlands, California. The polygon is filled with a semi-transparent color and outlined with a solid border.

What's next

Display a complex static map

Display a static map with multiple geometries and custom marker symbols.

REST API Python HTML/JavaScript