Can I remove just the popup bubbles of POI’s in Google Maps API v3?

by

Editor’s note: this answer was applicable until version 3.23. Since version 3.24 released in 2016, you can use clickableIcons map option. See xomena’s answer.

Version ~3.12 fix. Demo

Here is a new patch that works again. I have tested it with version 3.14.

Now we gonna patch set() instead of open().

function fixInfoWindow() {
    // Here we redefine the set() method.
    // If it is called for map option, we hide the InfoWindow, if "noSuppress"  
    // option is not true. As Google Maps does not know about this option,  
    // its InfoWindows will not be opened.

    var set = google.maps.InfoWindow.prototype.set;

    google.maps.InfoWindow.prototype.set = function (key, val) {
        if (key === 'map' && ! this.get('noSuppress')) {
            console.warn('This InfoWindow is suppressed.');
            console.log('To enable it, set "noSuppress" option to true.');
            return;
        }

        set.apply(this, arguments);
    }
}

What you have to do is set option noSuppress to true for your own InfoWindow‘s in order to open them, for example:

var popup = new google.maps.InfoWindow({
    content: 'Bang!',
    noSuppress: true
});

popup.setPosition(new google.maps.LatLng(-34.397, 150.644));

popup.open(map);

or:

var popup = new google.maps.InfoWindow({
    content: 'Bang!',
});

popup.set('noSuppress', true);
popup.setPosition(new google.maps.LatLng(-34.397, 150.644));

popup.open(map);

More Related Contents:

  1. Google Maps JS API v3 – Simple Multiple Marker Example
  2. Using Address Instead Of Longitude And Latitude With Google Maps API
  3. How to Display Multiple Google Maps per page with API V3
  4. Google Map API v3 — set bounds and center
  5. Google Map API – multiple icons in wrong spot
  6. What’s the API Key for in Google Maps API V3?
  7. Google Maps API autocomplete 2nd address fields on same page
  8. google maps move marker with lat/lng from ajax success returned data
  9. Google Maps API V3 : How show the direction from a point A to point B (Blue line)?
  10. Do I need to hide API key when using google maps js API? If so, how?
  11. How to set zoom level in google map
  12. Have just one InfoWindow open in Google Maps API v3
  13. Google Maps – How to get the distance between two point in metre?
  14. Load google maps v3 dynamically with ajax
  15. How to get the formatted address from a dragged marker in Google Version Maps
  16. How to draw a polygon around a polyline in JavaScript?
  17. Open infoWindows from an external link outside of the google map
  18. XMLHttpRequest cannot load No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:3000’ Google maps
  19. Animating Multiple Markers
  20. Google Maps API v3: How do I dynamically change the marker icon?
  21. Google map custom marker with css rounded corner
  22. How to trigger the onclick event of a marker on a Google Maps V3?
  23. Google Maps: Auto close open InfoWindows?
  24. Determine if point is within bounding box
  25. Add CSS styled marker to google maps
  26. Adding simple marker clusterer to google map
  27. Google map multiple overlay no cumulative opacity
  28. Google Directions Api returning 0 routes
  29. Change map opacity outside circle of Google Maps JavaScript API v3
  30. Google maps API V3 method fitBounds()

Leave a Comment