Maps API v2

Static Maps API

The Static Maps API can be initiated using both Named and Anonymous Maps using the ‘layergroupid’ token. The API can be used to create static images of parts of maps and thumbnails for use in web design, graphic design, print, field work, and many other applications that require standard image formats.

Maps API endpoints

Begin by instantiating either a Named or Anonymous Map using the layergroupid token as demonstrated in the Maps API documentation above. The layergroupid token calls to the map and allows for parameters in the definition to generate static images.

Zoom + center

Definition

1
GET /api/v1/map/static/center/{token}/{z}/{lat}/{lng}/{width}/{height}.{format}

Params

Bounding Box

Definition

1
GET /api/v1/map/static/bbox/{token}/{bbox}/{width}/{height}.{format}`

Params

Note: you can see this endpoint as

1
GET /api/v1/map/static/bbox/{token}/{west},{south},{east},{north}/{width}/{height}.{format}`

Named Map

Definition

1
GET /api/v1/map/static/named/{name}/{width}/{height}.{format}

Params

A Named Maps static image will get its constraints from the view argument of the Create Named Map function. If view is not defined, it will estimate the extent based on the involved tables, otherwise it fallbacks to "zoom": 1, "lng": 0 and "lat": 0.

Layers

The Static Maps API allows for multiple layers of incorporation into the MapConfig to allow for maximum versatility in creating a static map. The examples below were used to generate the static image example in the next section, and appear in the specific order designated.

Basemaps

1
2
3
4
5
6
7
8
9
10
11
{
  "type": "http",
  "options": {
    "urlTemplate": "http://{s}.basemaps.cartocdn.com/dark_nolabels/{z}/{x}/{y}.png",
    "subdomains": [
      "a",
      "b",
      "c"
    ]
  }
}

By manipulating the "urlTemplate" custom basemaps can be used in generating static images. Supported map types for the Static Maps API are:

1
2
3
4
'http://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png',
'http://{s}.basemaps.cartocdn.com/dark_nolabels/{z}/{x}/{y}.png',
'http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png',
'http://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png',

Mapnik

1
2
3
4
5
6
7
8
{
  "type": "mapnik",
  "options": {
    "sql": "select null::geometry the_geom_webmercator",
    "cartocss": "#layer {\n\tpolygon-fill: #FF3300;\n\tpolygon-opacity: 0;\n\tline-color: #333;\n\tline-width: 0;\n\tline-opacity: 0;\n}",
    "cartocss_version": "2.2.0"
  }
},

CARTO

As described in the MapConfig File Format, a “cartodb” type layer is now just an alias to a “mapnik” type layer as above, intended for backwards compatibility.

1
2
3
4
5
6
7
8
{
  "type": "cartodb",
  "options": {
    "sql": "select * from park",
    "cartocss": "/** simple visualization */\n\n#park{\n  polygon-fill: #229A00;\n  polygon-opacity: 0.7;\n  line-color: #FFF;\n  line-width: 0;\n  line-opacity: 1;\n}",
    "cartocss_version": "2.1.1"
  }
}

Additionally, static images from Torque maps and other map layers can be used together to generate highly customizable and versatile static maps.

Caching

It is important to note that generated images are cached from the live data referenced with the layergroupid token on the specified CARTO account. This means that if the data changes, the cached image will also change. When linking dynamically, it is important to take into consideration the state of the data and longevity of the static image to avoid broken images or changes in how the image is displayed. To obtain a static snapshot of the map as it is today and preserve the image long-term regardless of changes in data, the image must be saved and stored locally.

Limits

• While images can encompass an entirety of a map, the limit for pixel range is 8192 x 8192.
• Image resolution is set to 72 DPI
• JPEG quality is 85%
• Timeout limits for generating static maps are the same across CARTO Builder and CARTO Engine. It is important to ensure timely processing of queries.
• If you are publishing your map as a static image with the API, you must manually add attributions for your static map image. For example, add the following attribution code:

attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="https://carto.com/attributions">CARTO</a>

Examples

After instantiating a map from a CARTO account:

Call

1
 GET /api/v1/map/static/center/{layergroupid}/{z}/{x}/{y}/{width}/{height}.png

Response

MapConfig

For this map, the multiple layers, order, and stylings are defined by the MapConfig.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
{
  "version": "1.3.0",
  "layers": [
    {
      "type": "http",
      "options": {
        "urlTemplate": "http://{s}.basemaps.cartocdn.com/dark_nolabels/{z}/{x}/{y}.png",
        "subdomains": [
          "a",
          "b",
          "c"
        ]
      }
    },
    {
      "type": "mapnik",
      "options": {
        "sql": "select null::geometry the_geom_webmercator",
        "cartocss": "#layer {\n\tpolygon-fill: #FF3300;\n\tpolygon-opacity: 0;\n\tline-color: #333;\n\tline-width: 0;\n\tline-opacity: 0;\n}",
        "cartocss_version": "2.2.0"
      }
    },
    {
      "type": "cartodb",
      "options": {
        "sql": "select * from park",
        "cartocss": "/** simple visualization */\n\n#park{\n  polygon-fill: #229A00;\n  polygon-opacity: 0.7;\n  line-color: #FFF;\n  line-width: 0;\n  line-opacity: 1;\n}",
        "cartocss_version": "2.1.1"
      }
    },
    {
      "type": "cartodb",
      "options": {
        "sql": "select * from residential_zoning_2009",
        "cartocss": "/** simple visualization */\n\n#residential_zoning_2009{\n  polygon-fill: #c7eae5;\n  polygon-opacity: 1;\n  line-color: #FFF;\n  line-width: 0.2;\n  line-opacity: 0.5;\n}",
        "cartocss_version": "2.1.1"
      }
    },
    {
      "type": "cartodb",
      "options": {
        "sql": "select * from nycha_developments_july2011",
        "cartocss": "/** simple visualization */\n\n#nycha_developments_july2011{\n  polygon-fill: #ef3b2c;\n  polygon-opacity: 0.7;\n  line-color: #FFF;\n  line-width: 0;\n  line-opacity: 1;\n}",
        "cartocss_version": "2.1.1"
      }
    }
  ]
}