I use Google Maps in an internal web application using the JavaScript API. I programmatically plot pins for locations relevant to our customers & other data locations. However, things like restaurants, shopping locations, malls, etc. are not relevant and just clutter the map, and I'd prefer they be hidden
- Using the
stylesmap option when creating the map, I can accomplish this with the following, and the pins all go away. (current implementation)
const noIconsStyle = [
{
"elementType": "labels.icon",
"stylers": [ { "visibility": "off" } ]
}
];
var mapOptions = {
mapTypeId: google.maps.MapTypeId.ROADMAP,
styles: noIconsStyle //set map style
};
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions );
- I can also do this using the legacy style system on the Google Maps Platform website and it works as expected, I just need to add a
mapIdoption when I instantiate my map and it'll use the style I have connected to thatmapId.
- However the new style editor has no "all" section. And upgrading a legacy style results in that setting being lost, and all the pins come back. I can try toggling the setting for all "Points of Interest", but it doesn't actually apply to all of them, some still show.
I can turn off labels for all 4 of the top level categories (Points of Interest, Political, Infrastructure, and Natural), and I still get pins for some stores, malls, cinema, golf courses, etc.
The reason I'm revisiting this is that currently I'm using option #1. But I want to take advantage of the new AdvancedMarkerView in place of the traditional Marker class, but that requires that the map have a mapId. Once I do that, I get a warning in the console that a map's styles property can't be set when using a mapId, so now option #1 is out and I'm looking at alternatives.
Am I missing something or did they break/remove the ability to hide all pins on the map with their new Map Styles?

