You can access Esri Leaflet modules on the CDN or you can install them with NPM. The builds are also available for download on GitHub . To find the latest release and to learn about older versions and compatibility, go to Releases .
Leaflet library leaflet
CDN NPM CopyUse dark colors for code blocks
1
2
< link rel = "stylesheet" href = "https://unpkg.com/leaflet@1.8.0/dist/leaflet.css" />
< script src = "https://unpkg.com/leaflet@1.8.0/dist/leaflet.js" > </ script >
Install Leaflet from npm :
CopyUse dark colors for code blocks
1
npm install leaflet --save
Esri Leaflet plugin The main CDN and NPM references are listed below. To find other Esri and community plugins, go to Plugins .
esri-leaflet
Access the core mapping functionality to interact with ArcGIS location services .
CDN NPM CopyUse dark colors for code blocks
1
2
3
< script src = "https://unpkg.com/esri-leaflet@3.0.8/dist/esri-leaflet.js"
integrity = "sha512-oUArlxr7VpoY7f/dd3ZdUL7FGOvS79nXVVQhxlg6ij4Fhdc4QID43LUFRs7abwHNJ0EYWijiN5LP2ZRR2PY4hQ=="
crossorigin = "" > </ script >
Install Esri Leaflet from npm :
CopyUse dark colors for code blocks
1
npm install esri-leaflet --save
esri-leaflet-vector
Access and display vector tile layers and vector basemap layers.
CDN NPM CopyUse dark colors for code blocks
1
2
3
4
<!-- Vector Tiles -->
< script src = "https://unpkg.com/esri-leaflet-vector@3.1.1/dist/esri-leaflet-vector.js"
integrity = "sha512-7rLAors9em7cR3/583gZSvu1mxwPBUjWjdFJ000pc4Wpu+fq84lXF1l4dbG4ShiPQ4pSBUTb4e9xaO6xtMZIlA=="
crossorigin = "" > </ script >
CopyUse dark colors for code blocks
1
npm i esri-leaflet-vector
esri-leaflet-geocoder
A visual control for finding addresses and places that uses the geocoding service .
CDN NPM CopyUse dark colors for code blocks
1
2
3
4
5
6
7
<!-- Geocoding Control -->
< link rel = "stylesheet" href = "https://unpkg.com/esri-leaflet-geocoder@3.1.3/dist/esri-leaflet-geocoder.css"
integrity = "sha512-IM3Hs+feyi40yZhDH6kV8vQMg4Fh20s9OzInIIAc4nx7aMYMfo+IenRUekoYsHZqGkREUgx0VvlEsgm7nCDW9g=="
crossorigin = "" >
< script src = "https://unpkg.com/esri-leaflet-geocoder@3.1.3/dist/esri-leaflet-geocoder.js"
integrity = "sha512-enHceDibjfw6LYtgWU03hke20nVTm+X5CRi9ity06lGQNtC9GkBNl/6LoER6XzSudGiXy++avi1EbIg9Ip4L1w=="
crossorigin = "" > </ script >
CopyUse dark colors for code blocks
1
npm i esri-leaflet-geocoder
esri-leaflet-cluster
Display clusters for overlapping points in a feature layer .
CDN NPM CopyUse dark colors for code blocks
1
2
3
4
<!-- Clustered Feature Layer -->
< script src = "https://unpkg.com/esri-leaflet-cluster@2.1.0/dist/esri-leaflet-cluster.js"
integrity = "sha512-fEdNFHisleVtEYdLhW4Z2RsR7TN6hLutE/+O4D+skfTNY2rlHm8HOZARPWkdrFFy/+i2KjFxcZAKTUWaVfbV0g=="
crossorigin = "" > </ script >
CopyUse dark colors for code blocks
1
npm i esri-leaflet-cluster
esri-leaflet-heatmap
Constructs a heatmap layer from a feature layer that contains points.
CDN NPM CopyUse dark colors for code blocks
1
2
3
4
<!-- Heatmap Feature Layer -->
< script src = "https://unpkg.com/esri-leaflet-heatmap@2.0.0/dist/esri-leaflet-heatmap.js"
integrity = "sha512-fSJJRfO4PK90PN9jKKBzBZmzlNRsR12QA/CqTTWgfUTfLMF1Nrx5ouOqlpzC8LQIP+Qz0/G4BlHSgxHrCLHuMA=="
crossorigin = "" > </ script >
CopyUse dark colors for code blocks
1
2
npm i esri-leaflet-heatmap-feature-layer
esri-leaflet-renderer
Display the renderer and symbols defined in the feature service for a feature layer.
CDN NPM CopyUse dark colors for code blocks
1
2
3
4
<!-- Renderers Plugin -->
< script src = "https://unpkg.com/esri-leaflet-renderers@2.1.2/dist/esri-leaflet-renderers.js"
integrity = "sha512-/McnqdlwYvfeOEWqoniEagFRQnLi/TNbkHe4EJypmZI02LBT7vBU/+PZ5W3FSsFFlRbnMCsJvnbp5MX8XOBrnQ=="
crossorigin = "" > </ script >
CopyUse dark colors for code blocks
1
npm i esri-leaflet-renderers
esri-leaflet-gp
Simplifies making calls to geoprocessing tasks.
CDN NPM CopyUse dark colors for code blocks
1
2
3
4
<!-- Geoprocessing Plugin -->
< script src = "https://unpkg.com/esri-leaflet-gp@2.0.3/dist/esri-leaflet-gp.js"
integrity = "sha512-pYExthzLUD0etGnsvN2vg1LOEBd0nAfIwgZWlxavdBPNc2JT+f9hDQrXJrIhHK5WmuHVAuAb8jDekD36P/pXhg=="
crossorigin = "" > </ script >
CopyUse dark colors for code blocks