我正在尝试使用自定义样式简化谷歌地图布局。我无法解决的一个问题是正在展示建筑内部。例如,纽约时代华纳大厦:
以下代码将生成示例的简化地图:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map_canvas {
margin: 0;
padding: 0;
height: 100%;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 18,
center: new google.maps.LatLng(40.7681, -73.9819),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map_canvas'),
mapOptions);
var styles = [
{
"featureType": "poi",
"stylers": [
{ "visibility": "off" }
]
},{
"featureType": "landscape",
"stylers": [
{ "visibility": "off" }
]
},{
"featureType": "transit",
"stylers": [
{ "visibility": "off" }
]
}
]
;
map.setOptions({styles: styles});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map_canvas"></div>
</body>
</html>
如果我打开“所有”功能的可见性,建筑物内部确实会与其他所有功能一起消失。但是,我一直无法弄清楚如何只是让内部消失。
任何帮助都非常感谢!
答案 0 :(得分:3)
找出答案。您关闭所有POI,然后仅打开您想要显示的内容。 这是使建筑物内部(以及其他一切)不出现的造型器:
var styles = [
{"stylers": [
{ "visibility": "off" },
]},
{
"featureType": "road",
"stylers": [
{ "visibility": "on" }
]
}];