Class
This class allows you to load and display ArcGIS vector tile layers in a MapLibre map.
The VectorTileLayer
class provides functionality for:
- Loading and displaying vector tile layers from ArcGIS Online item IDs or feature service URLs.
- Adding sources and layers to a MapLibre map.
- Managing vector tile layer styles.
- Managing vector tile layer visibility and opacity.
import { VectorTileLayer } from '@esri/maplibre-arcgis';
// Add a vector tile layer from an ArcGIS item ID
const vectorLayer = await maplibreArcGIS.VectorTileLayer.fromPortalItem('e0b5e1aa287845d78b1dabd3223ebed1');
vectorLayer.addSourcesAndLayersTo(map);
// Add a vector tile layer from an ArcGIS vector tile service URL
const vectorLayer2 = await maplibreArcGIS.VectorTileLayer.fromUrl('https://vectortileservices3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Santa_Monica_parcels_VTL/VectorTileServer');
vectorLayer2.addSourcesAndLayersTo(map);
Constructors
constructor
Class ConstructorVectorTileLayer(options: IVectorTileLayerOptions): VectorTileLayer
Creates a new VectorTileLayer instance. You must provide either an ArcGIS item ID or a vector tile service URL. If both are provided, the item ID will be used and the URL ignored.
import { VectorTileLayer } from '@esri/maplibre-arcgis';
const vectorLayer = new VectorTileLayer({url: 'https://vectortileservices3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Santa_Monica_parcels_VTL/VectorTileServer', authentication: "YOUR_ACCESS_TOKEN"});
await vectorLayer.initialize();
vectorLayer.addSourcesAndLayersTo(map);
Creating layers using the constructor directly is not recommended. Use the VectorTileLayer.fromUrl and VectorTileLayer.fromPortalItem static methods instead.
Parameters
Parameter | Type | Notes |
---|---|---|
options | IVectorTileLayerOptions | Configuration options for the vector tile layer. You must provide either an ArcGIS item ID or a vector tile service URL. If both are provided, the item ID will be used and the URL ignored. |
Returns
VectorTileLayer
Properties
Property | Type | Notes |
---|---|---|
style | StyleSpecification | Style specification. |
token inherited | string | An ArcGIS access token is required for accessing secure data layers. To get a token, go to the Security and Authentication Guide. |
token
token: string
An ArcGIS access token is required for accessing secure data layers. To get a token, go to the Security and Authentication Guide.
Accessors
Accessor | Returns |
---|---|
layer() inherited | Readonly<LayerSpecification> |
layers() inherited | readonlyLayerSpecification[] |
source() inherited | Readonly<SupportedSourceSpecification> |
sourceId() inherited | string |
sources() inherited | Readonly<{}> |
layer
layer(): Readonly<LayerSpecification>
Retrieves the layer for the hosted layer.
Returns
Readonly<LayerSpecification>
layers
layers(): readonlyLayerSpecification[]
Retrieves the layers for the hosted layer.
Returns
readonlyLayerSpecification[]
source
source(): Readonly<SupportedSourceSpecification>
Retrieves the source for the hosted layer.
Returns
Readonly<SupportedSourceSpecification>
sourceId
sourceId(): string
Retrieves the source ID for the hosted layer.
Returns
string
sources
sources(): Readonly<{}>
Retrieves the sources for the hosted layer.
Returns
Readonly<{}>
Methods
Method | Returns | Notes |
---|---|---|
_cleanStyle(style) | void | |
_loadItemInfo() | Promise<IItemInfo> | Retrieves information from the portal about item attribution and associated service URLs |
_loadServiceInfo() | Promise<IVectorTileServiceInfo> | Retrieves information from the data service about data attribution, associated item IDs, and more. |
_loadStyleFromItemId() | Promise<StyleSpecification> | |
_loadStyleFromServiceUrl() | Promise<StyleSpecification> | |
addLayersTo(map) inherited | HostedLayer | Add layers to a maplibre map. |
addSourcesAndLayersTo(map) inherited | HostedLayer | Convenience method that adds all associated Maplibre sources and data layers to a map. |
addSourcesTo(map) inherited | HostedLayer | |
copyLayer(layerId) inherited | LayerSpecification | Returns a mutable copy of the specified layer |
copySource(sourceId) inherited | SupportedSourceSpecification | Returns a mutable copy of the specified source. |
initialize() | Promise<VectorTileLayer> | Initializes the layer with data from ArcGIS. Called to instantiate a class. |
setAttribution(sourceId, attribution) inherited | void | Sets the data attribution of the specified source |
setSourceId(oldId, newId) inherited | void | Changes the ID of a maplibre style source, and updates all associated maplibre style layers. |
fromPortalItem(itemId, options) | Promise<VectorTileLayer> | Creates a new VectorTileLayer instance from an ArcGIS vector tile service URL. You must provide a valid vector tile service URL. |
fromUrl(serviceUrl, options) | Promise<VectorTileLayer> | Creates a new VectorTileLayer instance from an ArcGIS vector tile service URL. You must provide a valid vector tile service URL. |
_cleanStyle
Class Method_cleanStyle(style: StyleSpecification): void
Parameters
Parameter | Type |
---|---|
style | StyleSpecification |
Returns
void
_loadItemInfo
Class Method_loadItemInfo(): Promise<IItemInfo>
Retrieves information from the portal about item attribution and associated service URLs
Returns
Promise<IItemInfo>
_loadServiceInfo
Class Method_loadServiceInfo(): Promise<IVectorTileServiceInfo>
Retrieves information from the data service about data attribution, associated item IDs, and more.
Returns
Promise<IVectorTileServiceInfo>
_loadStyleFromItemId
Class Method_loadStyleFromItemId(): Promise<StyleSpecification>
Returns
Promise<StyleSpecification>
_loadStyleFromServiceUrl
Class Method_loadStyleFromServiceUrl(): Promise<StyleSpecification>
Returns
Promise<StyleSpecification>
addLayersTo
addLayersTo(map: Map$1): HostedLayer
Add layers to a maplibre map.
Parameters
Parameter | Type | Notes |
---|---|---|
map | Map$1 | A maplibre map object |
Returns
HostedLayer
addSourcesAndLayersTo
addSourcesAndLayersTo(map: Map$1): HostedLayer
Convenience method that adds all associated Maplibre sources and data layers to a map.
Parameters
Parameter | Type | Notes |
---|---|---|
map | Map$1 |
Returns
HostedLayer
addSourcesTo
addSourcesTo(map: Map$1): HostedLayer
Parameters
Parameter | Type |
---|---|
map | Map$1 |
Returns
HostedLayer
copyLayer
copyLayer(layerId: string): LayerSpecification
Returns a mutable copy of the specified layer
Parameters
Parameter | Type | Notes |
---|---|---|
layer | string | The ID of the maplibre style layer to copy |
Returns
LayerSpecification
copySource
copySource(sourceId: string): SupportedSourceSpecification
Returns a mutable copy of the specified source.
Parameters
Parameter | Type | Notes |
---|---|---|
source | string | The ID of the maplibre style source to copy. |
Returns
SupportedSourceSpecification
initialize
Class Methodinitialize(): Promise<VectorTileLayer>
Initializes the layer with data from ArcGIS. Called to instantiate a class.
Returns
Promise<VectorTileLayer>
setAttribution
setAttribution(sourceId: string, attribution: string): void
Sets the data attribution of the specified source
Parameters
Parameter | Type | Notes |
---|---|---|
source | string | The ID of the maplibre style source. |
attribution | string | Custom attribution text. |
Returns
void
setSourceId
setSourceId(oldId: string, newId: string): void
Changes the ID of a maplibre style source, and updates all associated maplibre style layers.
Parameters
Parameter | Type | Notes |
---|---|---|
old | string | The source ID to be changed. |
new | string | The new source ID. |
Returns
void
fromPortalItem
fromPortalItem(itemId: string, options: IVectorTileLayerOptions): Promise<VectorTileLayer>
Creates a new VectorTileLayer instance from an ArcGIS vector tile service URL. You must provide a valid vector tile service URL.
import { VectorTileLayer } from '@esri/maplibre-arcgis';
// Add a vector tile layer from an ArcGIS item ID
const vectorLayer = await maplibreArcGIS.VectorTileLayer.fromPortalItem('e0b5e1aa287845d78b1dabd3223ebed1');
vectorLayer.addSourcesAndLayersTo(map);
Parameters
Parameter | Type | Notes |
---|---|---|
item | string | ArcGIS item ID of a vector tile layer. |
options | IVectorTileLayerOptions | Configuration options for the vector tile layer. |
Returns
Promise<VectorTileLayer>
A promise that resolves to a VectorTileLayer instance.
fromUrl
fromUrl(serviceUrl: string, options: IVectorTileLayerOptions): Promise<VectorTileLayer>
Creates a new VectorTileLayer instance from an ArcGIS vector tile service URL. You must provide a valid vector tile service URL.
import { VectorTileLayer } from '@esri/maplibre-arcgis';
// Add a vector tile layer from an ArcGIS vector tile service URL
const vectorLayer = await maplibreArcGIS.VectorTileLayer.fromUrl('https://vectortileservices3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Santa_Monica_parcels_VTL/VectorTileServer');
vectorLayer.addSourcesAndLayersTo(map);
Parameters
Parameter | Type | Notes |
---|---|---|
service | string | URL to an ArcGIS vector tile service. |
options | IVectorTileLayerOptions | Configuration options for the vector tile layer. |
Returns
Promise<VectorTileLayer>
A promise that resolves to a VectorTileLayer instance.