nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to set vactorTile Layer as costum basemap?

SebastianBosbach

Hi everyone,

how can I set a custom vector tile layer as a basemap, so it will appear in the basemap dijit?

When I try to add vector layer as a basemap, it doesn't work because it seems a BaseMapLayer only works with tile based services.

Greetings Sebastian

Encuentra más publicaciones etiquetadas con

Accepted answers

UndralBatsukh

Hi there,

You can add VectorTileLayer as a basemap to the basemapGallery as shown below. You need to specify styleUrl and type properties of the BasemapLayer.

var vtlayer = new BasemapLayer({

styleUrl: "https://www.arcgis.com/sharing/rest/content/items/dfcb45f8a2ad4b58a1a7547188a0a00c/resources/styles/root.json",

type: "VectorTileLayer"

});

var vtlBasemap = new Basemap({

layers: [vtlayer],

title: "Xmas Template",

thumbnailUrl:"images/basemap.png"

});

Please use this working app to see how this is done.

JS Bin - Collaborative JavaScript Debugging

We will update the BasemapLayer documentation to show how to add VectorTileLayer as a basemap to the basemapGallery.

Hope this helps,

-Undral

All comments

SebastianBosbach

Dose nobody have a solution or suggestion to this problem?

I waited some api versions and as I see, there is still not way to ad a vector layer as a basemap.

Greetings Sebastian

UndralBatsukh

Hi there,

You can add VectorTileLayer as a basemap to the basemapGallery as shown below. You need to specify styleUrl and type properties of the BasemapLayer.

var vtlayer = new BasemapLayer({

styleUrl: "https://www.arcgis.com/sharing/rest/content/items/dfcb45f8a2ad4b58a1a7547188a0a00c/resources/styles/root.json",

type: "VectorTileLayer"

});

var vtlBasemap = new Basemap({

layers: [vtlayer],

title: "Xmas Template",

thumbnailUrl:"images/basemap.png"

});

Please use this working app to see how this is done.

JS Bin - Collaborative JavaScript Debugging

We will update the BasemapLayer documentation to show how to add VectorTileLayer as a basemap to the basemapGallery.

Hope this helps,

-Undral

SebastianBosbach

Hi, thank you so much Undral.

Your code works very well. The problem was, that this isn't documented in the api reference.

Also the above code only adds the layer to the Gallery, but not to the static "basemaps" object, which I also wanted to do. Because I also want to set my vector tile layer as the initial basemap.

So if anyone else got this problem, her is an example code to do this.

basemaps[basemap.id] = {
    baseMapLayers: [
        {url: basemap.url, type: "VectorTile"}
    ],
    title: basemap.title,
    thumbnailUrl: basemap.thumbnailUrl,
};

The important part is, that you have to set the type to "VectorTile" instead of "VectorTileLayer", wich is needed in the BasemapLayer object.

@Undral

I think it would be good to add this to the api reference. If this is somewhere in the reference, please show me where I could have found this, thanks.

best regards,

Sebastian

Únete a la Conversación

Los miembros registrados pueden publicar, seguir actualizaciones y más. ¿Nuevo aquí? Regístrate gratis.

Enlaces Rápidos

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.