2012-11-08 86 views
4

我有一個自定義樣式的Google地圖。隱藏Google Maps API v3中的所有建築物

我想隱藏或顯示所有建築物的風格。 Seen here (with buildings)

從文檔看,似乎沒有辦法隱藏建築物,事實上,似乎沒有任何關於建築物(政府建築物除外)的任何參考。

是否有可能隱藏這些 - &如果是這樣,怎麼辦?

這裏的地圖代碼:

<script src="http://maps.google.com/maps/api/js?sensor=false" 
type="text/javascript"></script> 

<div id="map"></div> 

<script type="text/javascript"> 

var address = 'Bowie, MD'; 

var styles = [ 
{ 
featureType: 'landscape', 
elementType: 'all', 
stylers: [ 
{ hue: '#33548f' }, 
{ saturation: 28 }, 
{ lightness: -57 }, 
{ visibility: 'simplified' } 
] 
},{ 
featureType: 'road.local', 
elementType: 'all', 
stylers: [ 
{ "visibility": "simplified" }, 
{ "color": "#366b97" } 
] 
},{ 
featureType: 'poi', 
elementType: 'all', 
stylers: [ 
{ hue: '#33548f' }, 
{ saturation: 8 }, 
{ lightness: -51 }, 
{ visibility: 'off' } 
] 
},{ 
featureType: 'road.highway', 
elementType: 'all', 
stylers: [ 
{ hue: '#233961' }, 
{ saturation: -53 }, 
{ lightness: -60 }, 
{ visibility: 'on' } 
] 
},{ 
featureType: 'water', 
elementType: 'all', 
stylers: [ 
{ hue: '#2a4576' }, 
{ saturation: 5 }, 
{ lightness: -59 }, 
{ visibility: 'simplified' } 
] 
},{ 
featureType: 'administrative', 
elementType: 'all', 
stylers: [ 
{ hue: '#333333' }, 
{ saturation: 0 }, 
{ lightness: -61 }, 
{ visibility: 'off' } 
] 
},{ 
featureType: 'administrative', 
elementType: 'all', 
stylers: [ 
{ hue: '#333333' }, 
{ saturation: 0 }, 
{ lightness: -61 }, 
{ visibility: 'off' } 
] 
},{ 
featureType: 'road.arterial', 
elementType: 'all', 
stylers: [ 
{ hue: '#2c487b' }, 
{ saturation: -53 }, 
{ lightness: -57 }, 
{ visibility: 'on' } 
] 
} 
]; 
var options = { 
mapTypeControlOptions: { 
mapTypeIds: [ 'Styled'] 
}, 
center: new google.maps.LatLng(38.956318403646755, -76.72218313217161), 
zoom: 16, 
mapTypeId: 'Styled', 
panControl: false, 
zoomControl: true, 
zoomControlOptions: { 
style: google.maps.ZoomControlStyle.LARGE, 
position: google.maps.ControlPosition.RIGHT_TOP 
}, 
mapTypeControl: false,    
scaleControl: false, 
}; 
var div = document.getElementById('map'); 
var map = new google.maps.Map(div, options); 
var styledMapType = new google.maps.StyledMapType(styles, { name: 'Styled' }); 
map.mapTypes.set('Styled', styledMapType); 

var geocoder = new google.maps.Geocoder(); 

geocoder.geocode({ 
'address': address 
}, 
function(results, status) { 
if(status == google.maps.GeocoderStatus.OK) { 
new google.maps.Marker({ 
position: results[0].geometry.location, 
map: map 
}); 
map.setCenter(results[0].geometry.location); 
} 
else { 
// Google couldn't geocode this request. Handle appropriately. 
} 
}); 

</script> 
+0

請發表您生成的地圖代碼。 –

+1

這個答案似乎不工作了:http://stackoverflow.com/questions/12127409/google-map-building-style – geocodezip

回答

0

要隱藏的建築物,你需要添加任何特定的風格之前設置"visibility": "simplified"全球。

然後,您可以返回並將可見性設置爲「開啓」併爲每個元素添加其他樣式。

似乎API應該有一個控制建築物的方法,但是看起來他們目前沒有。這將需要工作,直到那時。

例如:

var styles = [ 
     { 
     "stylers": [ 
      { "visibility": "simplified" }, 
      { "saturation": -100 } 
     ] 
     },{ 
     "featureType": "road.local", 
     "elementType": "labels.text", 
     "stylers": [ 
      { "visibility": "on" } 
     ] 
     },{ 
     "featureType": "road.highway", 
     "elementType": "labels.text", 
     "stylers": [ 
      { "visibility": "on" } 
     ] 
     },{ 
     "featureType": "road.arterial", 
     "stylers": [ 
      { "visibility": "on" } 
     ] 
     },{ 
     "featureType": "poi", 
     "stylers": [ 
      { "visibility": "on" }, 
      { "lightness": 25 } 
     ] 
     },{ 
     "featureType": "poi", 
     "stylers": [ 
      { "lightness": 1 } 
     ] 
     } 
    ]