Skip to content

The MapLibre ArcGIS plugin allows you to easily access and work with the ArcGIS Basemap Styles service, feature services, and vector tile services. To use the library you must first install the MapLibre GL JS library in your project.

Current version: 1.0.0

Install

Below are the steps to install the maplibre-gl and maplibre-arcgis package via NPM or to include it directly using CDN links.

NPM

Install the following packages:

Use dark colors for code blocksCopy
1
2
npm install maplibre-gl
npm install @esri/maplibre-arcgis

CDN

You can use maplibre-arcgis from a script tag. All exports will be added to a global maplibreArcGIS object.

index.html
Use dark colors for code blocksCopy
1
2
3
4
5
6
<!-- Maplibre GL JS -->
<script src=https://unpkg.com/maplibre-gl@5.10.0/dist/maplibre-gl.js></script>
<link href=https://unpkg.com/maplibre-gl@5.10.0/dist/maplibre-gl.css rel="stylesheet" />

<!-- MapLibre ArcGIS -->
<script src="https://unpkg.com/@esri/maplibre-arcgis@1.0.0/dist/umd/maplibre-arcgis.min.js"></script>

You can also use maplibre-arcgis as an ES Module.

index.html
Use dark colors for code blocksCopy
1
2
3
4
5
6
7
8
<script type="importmap">
  {
    "imports": {
      "maplibre-gl": "https://esm.run/maplibre-gl",
      "maplibre-arcgis": "https://unpkg.com/@esri/maplibre-arcgis@1.0.0/dist/esm/maplibre-arcgis.min.js"
    }
  }
</script>
app.js
Use dark colors for code blocksCopy
1
2
import maplibregl from "maplibre-gl";
import maplibreArcGIS from "maplibre-arcgis";

Classes

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.