Learn how to use Esri Leaflet and the basemap layer service to display a map.
You can display a map with Esri Leaflet by using a vector tile basemap layer from the basemap layer services. A vector tile basemap layer contains the styles, layers, font glyphs, and icons to render the layers.
In this tutorial, you display a map of the Santa Monica Mountains using the streets basemap layer from the Basemap layer service.
This code is used as the starting point for the other Esri Leaflet tutorials.
Prerequisites
You need an ArcGIS account to access the developer dashboard and create an API key.
Steps
Create a new pen
Go to CodePen to create a new pen for your application.
Add HTML and references
Create an HTML page with references to Leaflet, Esri Leaflet, and MapLibre GL JS. These are required to access and display vector tile basemap layers.
In the <head>, add <script> elements to reference to the libraries.
In the <head>, add a <style> element to provide styling for the page and map.
To access location services, you need an API key or OAuth 2.0 access token. To learn how to create and scope your key, visit the Create an API key tutorial.
Go to your dashboard to get an API key. The API key must be scoped to access the services used in this tutorial.