I am trying to add an arcgis online served vector tiles service to a Leaflet map. I am using ( https://github.com/Leaflet/Leaflet.VectorGrid ) to add the vector tiles to a Leaflet v1.3.1 map application.

I am able to add ESRI layers into the Leaflet map using the following simplified code:

var esriTilesUrl = "https://basemaps.arcgis.com/v1/arcgis/rest/services/World_Basemap/VectorTileServer/tile/{z}/{y}/{x}.pbf";

var esriTilesPbfLayer = L.vectorGrid.protobuf(esriTilesUrl);


However, when I try to add my arcgis online vector tiles to the leaflet map using the same code

var esriTilesUrl =  "https://tiles.arcgis.com/tiles/l4TwMwwoiuEVRPw9/arcgis/rest/services/CaryHouseHolds/VectorTileServer/tile/{z}/{y}/{x}.pbf";    

var esriTilesPbfLayer = L.vectorGrid.protobuf(esriTilesUrl);


I get the following error:

GET https://tiles.arcgis.com/tiles/l4TwMwwoiuEVRPw9/arcgis/rest/services/CaryHouseHolds/VectorTileServer/tile/13/3222/2303.pbf 404 ()

What is the correct url to use to consume arcgis online vector tiles?

  • Still not working for you? As of today, works for me using an ArcGIS Online Vector Tile layer.
    – jhickok
    Commented Nov 20, 2019 at 6:47

1 Answer 1


I would suggest referencing Esri Leaflet in general for leaflet and Esri related code.

In regards to the Esri Vector Tile Layer You can use this option and construct.

L.esri.Vector.layer( id, , options)

key refers to the specific vector tile layer you'd like to add.

L.esri.Vector.Layer is used to display vector tile services and attributes data providers appropriately.

Options L.esri.Vector.Layer accepts all options.

Methods L.esri.Vector.Layer` inherits all methods from.

Example <script src="./esri-leaflet-vector.js"></script> var map = L.map('map').setView([37.75,-122.45], 12); L.esri.Vector.layer('bd505ce3efff479bb4e87b182f180159').addTo(map);

  • Thanks for your response. I am able to load the example 'bd505ce3efff479bb4e87b182f180159' just fine. However when I try to load my tiles: L.esri.Vector.layer('3c41cfb096844078a44adfe57819464a').addTo(map); I get a bunch of mapbox-gl.js errors. My arcgis online item is: carync.maps.arcgis.com/home/… so I'm assuming that my key is '3c41cfb096844078a44adfe57819464a' . Any ideas? Commented Apr 10, 2018 at 15:45
  • Yes, that's correct ID.
    – whyzar
    Commented Apr 10, 2018 at 16:51
  • is there something that need to be done in the ArcGIS Online side to make these vector tiles available to a leaflet app? Commented Apr 10, 2018 at 17:32
  • Are you able to post your full code?
    – whyzar
    Commented Apr 10, 2018 at 17:33
  • 1
    Yea sure thing, keep in mind, if this question is answered and you have a different one, be sure to close this one out and start a new thread that way others can view the thread and try to answer the specific question.
    – whyzar
    Commented Apr 10, 2018 at 18:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.