L.esri.Vector.vectorBasemapLayer

Extends L.esri.Vector.vectorTileLayer

L.esri.Vector.vectorBasemapLayer uses the esri-leaflet-vector plugin to display vector tile basemaps from the Basemap styles service. It also handles basemap attribution.

Constructor

The required key parameter can be used to display either a basemap style enumeration or a custom basemap style.

Basemap style enumerations

Basemap style enumerations represent predefined basemap styles provided by ArcGIS. Set the key parameter to a valid style enumeration to load a basemap into your application.

V1 enumerations

Style enumerations from the Basemap styles service v1 contain two or three parts separated by a colon (:). Each part is written in camel case without spaces between words:

• {Provider}:{StyleName}
• {Provider}:{StyleName}:{Component}

Some examples include:

• ArcGIS:Imagery
• ArcGIS:HumanGeography:Detail
• OSM:Standard

V2 enumerations

Style enumerations from the Basemap styles service (v2) contain two or three parts separated by a forward slash (/). Each part is written in lowercase with words separated by dashes:

• {provider}/{style-name}
• {provider}/{style-name}/{component}

Some examples include:

• arcgis/imagery
• arcgis/human-geography/detail
• osm/standard

Custom basemap styles

L.esri.Vector.vectorBasemapLayer also supports custom basemap styles created with the Vector Tile Style Editor. To load a custom basemap style, set the key parameter to its item ID.

Options

L.esri.Vector.vectorBasemapLayer accepts all L.esri.Vector.vectorTileLayer options, though portalUrl has no effect. A valid API key or token is required to load a vector basemap layer.

function (style) {
    // make changes to the style object
    // return your style overrides
    return newStyleObj;
}

Default panes

By default, L.esri.Vector.vectorBasemapLayer objects are added to Leaflet maps using the following panes:

Methods

L.esri.Vector.vectorBasemapLayer inherits all methods from L.esri.Vector.vectorTileLayer.

Examples

1
2
3
4
5
6
  const map = L.map("map").setView([40.706, -73.926], 14);

  L.esri.Vector.vectorBasemapLayer("arcgis/outdoor", {
      token: "YOUR_ACCESS_TOKEN",
      version: 2 // this property is optional
  }).addTo(map);

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
49
50
51
52
53
54
55
      const map = L.map("map", {
        minZoom: 2
      })

      map.setView([34.02, -118.805], 13);

      const accessToken = "YOUR_ACCESS_TOKEN";

      const basemapEnum = "6976148c11bd497d8624206f9ee03e30";

      L.esri.Vector.vectorBasemapLayer(basemapEnum, {
        token: accessToken
      }).addTo(map);

1
2
3
4
5
6
  const map = L.map("map").setView([40.706, -73.926], 14);

  L.esri.Vector.vectorBasemapLayer("arcgis/streets", {
      token: "YOUR_ACCESS_TOKEN",
      language: "uk" // set language to Ukranian
  }).addTo(map);