Disable click behavior of POI markers in Google Maps JS API

Question

As of Google Maps API v3.6, maps now include "points of interest", which are gray markers embedded into a map. When the user clicks on this icon, an InfoWindow appears with information about that business (or park, hospital, etc.)

These can be turned off by setting the Styling. (See "Style Array Example")

https://code.google.com/apis/maps/documentation/javascript/styling.html

Once they are turned off, the icons, names, and shaded regions (for parks and hospitals) go away.

Before Google Maps API v3.6, there were no icons; only the names and regions.

The question: is there a way to remove the "click icon to open info window" behavior of these points of interest? I still want to keep the icons, names, and regions; only want to remove the click behavior.

Alternate question: is there a way to download/save the JavaScript of the v3.5 of Google Maps API to store on my server? At present, v3.5 is working fine for what I need. In February, Google will no longer provide v3.5 of the code and will instead provide only v3.6, v3.7, v3.8.

Retiring of minor versions of Google Maps API v3, and using the "frozen" version of an API:

https://code.google.com/apis/maps/documentation/javascript/basics.html#Versioning

Things I've tried and considered: Adding an event listener when the map is clicked does not work, because the embedded markers are clicked instead of the map. Adding "clickable: false" as a property was a shot in the dark, with no result. Setting "visiblility: off" removes it all, leaving the map with less content. Setting "visibility: simplified" removes the name of the location, though the onclick behavior is still present. Putting an invisible DIV overlaying the map might work, though it would remove the ability to pan/zoom/drag the map without increasing complexity.

Setting a style so that featureType: poi, elementType: labels, visibility: off will result in showing the pink/gray/green regions for hospitals/cemeteries/parks, without the marker or name. It returns more color to the map.

Answer 1

I'm not sure if this is still relevant to you, but Google did, indeed, solve the issue on April, 2016, all you need to do is clickableIcons to false in MapOptions

Answer 2

This issue has been logged with google at:

http://code.google.com/p/gmaps-api-issues/issues/detail?id=3866

Please star and comment your needs on this issue there.

Answer 3

I'm not sure this is not a violation of the Google Maps TOS, it's a bit hacky, and doesn't work on IE < 9, but you can listen on dom event, to detect the creation of the window, using Mutation Observer

Here is a plunkr to demonstrate : http://plnkr.co/edit/pGep9OZFligLhRtHlhgk You can check in the console, an event is fired (actually twice) when you click on a POI, and the window is hidden

Answer 4

By referencing this URL (https://stackoverflow.com/a/24234818/6160436), I somehow managed to hide the Info windows of POI and call the click event listener of map when the user clicks on the POI. But I'm not sure whether this violates TOS or not, so use at your own risk.

        //keep a reference to the original setPosition-function
        var fx = google.maps.InfoWindow.prototype.setPosition;

        //override the built-in setPosition-method
        google.maps.InfoWindow.prototype.setPosition = function () {

            //this property isn't documented, but as it seems
            //it's only defined for InfoWindows opened on POI's
            if (this.logAsInternal) {
                if (this.getPosition()) {
                    console.log(this.getPosition());
                    google.maps.event.trigger(map, 'click', {latLng: this.getPosition()});
                }
                else{
                    google.maps.event.addListenerOnce(this, 'map_changed',function () {
                        console.log(this.getPosition());
                        google.maps.event.trigger(map, 'click', {latLng: this.getPosition()});

                        // var map = this.getMap();
                        // //the infoWindow will be opened, usually after a click on a POI
                        // if (map) {
                            //trigger the click

                            var removeInfoWindow = null;

                            removeInfoWindow = setInterval(function(){
                                if ($('.gm-style-iw').parent().length) {
                                    $('.gm-style-iw').parent().hide();
                                    clearInterval(removeInfoWindow);
                                };
                            },1);
                        // }
                    });
                };
            }

            //call the original setPosition-method
            fx.apply(this, arguments);
        };

        google.maps.event.addListener(map,'click',function(e){
            alert('clicked @'+e.latLng.toString())
            console.log('ok');
        });