I'm trying to migrate my application to latest version of Google map API and found that Google appends it's own items by default from Google Places directory to the map. It does not look right together with my own records as it creates duplicate items on the map which can be placed in correctly.
Is there an option how to hide thi开发者_如何学编程s local businesses or to control what is shown and what is not?
here is sample code:
<!DOCTYPE html>
<html>
<head>
<title>Google Maps JavaScript API v3 Example: Map Simple</title>
<meta name="viewport"
content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta charset="UTF-8">
<style type="text/css">
html, body, #map_canvas {
margin: 0;
padding: 0;
height: 100%;
}
</style>
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var map;
function initialize() {
var myOptions = {
zoom: 16,
center: new google.maps.LatLng(37.422833333333,25.323166666667),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map_canvas'),
myOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map_canvas"></div>
</body>
</html>
As you can see on map, there are few tiny icons, which you can click on and information would appear in bubble. I need to hide this icons or at least disable on click event for this items.
Just a pointer - this seems possible with custom styled maps. If I'm not mistaken, the feature type you're looking for would be poi.business
, whose visiblity
you would turn off
.
There's a wizard to help you build the options array.
You can remove it by adding the following code:
var styles = [
{
featureType: "poi",
stylers: [
{ visibility: "off" }
]
}
];
var styledMap = new google.maps.StyledMapType(styles,{name: "Styled Map"});
精彩评论