4.28 Basemap Gallery List View

MichaelWen_Timmons

After I upgraded to JS API 4.28 my basemap gallery switched from list view to grid view. I didn't do anything to set styling before. How can I set the gallery back to list view?

AnneFitz

Hi Michael, if you set a max-width of 300px on the BasemapGallery's container then it should stay in the list view.

Here's an example: https://codepen.io/annefitz/pen/rNbRZPP?editors=1000

The BasemapLayerList widget is different - it does not allow you to switch basemap styles but instead displays the layers within your current basemap and allows you to toggle their visibility, similar to the LayerList widget.

Hope this helps!

View solution in original post

MichaelWen_Timmons

Anybody?

Are there any examples of BasemapLayerList? Looks like that has very different properties and it would be more effort than warranted just to switch from grid view to list view.

Another idea I heard is to modify the css. Again are there good examples or suggestions for how to proceed?

Any help is appreciated.

AnneFitz

Hi Michael, if you set a max-width of 300px on the BasemapGallery's container then it should stay in the list view.

Here's an example: https://codepen.io/annefitz/pen/rNbRZPP?editors=1000

The BasemapLayerList widget is different - it does not allow you to switch basemap styles but instead displays the layers within your current basemap and allows you to toggle their visibility, similar to the LayerList widget.

Hope this helps!

MichaelWen_Timmons

Thanks for this. It should work for me.

Just one quick question - how do I reduce the padding between each basemap? Ideally I want them to be half of their current size.

AnneFitz

You could try:

.esri-basemap-gallery__item {
   border: none;
}

All the CSS for the BasemapGallery is publicly available here if you need to make any other tweaks: https://github.com/Esri/arcgis-js-api/blob/4master/assets/esri/themes/base/widgets/_BasemapGallery.s...