Hide local listings from google maps api

google-maps-api-3

When using google maps api to display something google has started adding local restaurants/hotels into the map.
How can I hide them from appearing. I checked the same locations on sites that use maps (like yelp) and they successfully hide the local hotels/restaurants.
I've been looking for layers/overlays but can't figure out how I remove this default behavior.

example

These things are appearing on my maps. is it possible to hide these bubbles and names?

edit
https://developers.google.com/maps/documentation/javascript/releases#36
says that 3.6 introduces business icons on by default. So setting v=3.5 as a parameter will hide the "Business icons".

bounty
Is there a way of hiding the business messages without sticking with an older version of the api?

Best Answer

you can set them invisible by setting the map style properly. See

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

and

http://code.google.com/intl/pl/apis/maps/documentation/javascript/reference.html#MapTypeStyleFeatureType

sth like that should do the trick (though not tested):

var noPoi = [
{
    featureType: "poi",
    stylers: [
      { visibility: "off" }
    ]   
  }
];

map.setOptions({styles: noPoi});

Related Solutions

Javascript – Calculate distance between two points in google maps V3

If you want to calculate it yourself, then you can use the Haversine formula:

var rad = function(x) {
  return x * Math.PI / 180;
};

var getDistance = function(p1, p2) {
  var R = 6378137; // Earth’s mean radius in meter
  var dLat = rad(p2.lat() - p1.lat());
  var dLong = rad(p2.lng() - p1.lng());
  var a = Math.sin(dLat / 2) * Math.sin(dLat / 2) +
    Math.cos(rad(p1.lat())) * Math.cos(rad(p2.lat())) *
    Math.sin(dLong / 2) * Math.sin(dLong / 2);
  var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
  var d = R * c;
  return d; // returns the distance in meter
};

Javascript – Google Maps API v3: How to remove all markers

Simply do the following:

I. Declare a global variable:

var markersArray = [];

II. Define a function:

function clearOverlays() {
  for (var i = 0; i < markersArray.length; i++ ) {
    markersArray[i].setMap(null);
  }
  markersArray.length = 0;
}

google.maps.Map.prototype.clearOverlays = function() {
  for (var i = 0; i < markersArray.length; i++ ) {
    markersArray[i].setMap(null);
  }
  markersArray.length = 0;
}

III. Push markers in the 'markerArray' before calling the following:

markersArray.push(marker);
google.maps.event.addListener(marker,"click",function(){});

IV. Call the clearOverlays(); or map.clearOverlays(); function wherever required.

That's it!!

Best Answer

Related Solutions

Javascript – Calculate distance between two points in google maps V3

Javascript – Google Maps API v3: How to remove all markers

Related Topic