谷歌地图图层效果

Question

我创建了一个div并嵌入Google地图代码。

像这样：

但是，我希望让我的谷歌地图上的效果。

但我不知道谷歌地图API。

有简单的方法或其他soluitons？谢谢。

Answer 1

您可以自定义地图的样式。在这种情况下，您可能只想将饱和度设置为-100。

对于静态地图，网址可能是：http://maps.googleapis.com/maps/api/staticmap?center=0,0&zoom=2&format=png&sensor=false&size=640x480&maptype=roadmap&style=saturation:-100

对于动态地图，只要创建一个样式，并将其传递到您的地图选择：

var styles = [ 
    { 
    stylers: [ 
     { saturation: -100 } 
    ] 
    } 
] 

var mapOptions = { 
    zoom: 12, 
    center: new google.maps.LatLng(47.5,-122.5), 
    styles : styles 
} 

var map = map = new google.maps.Map(document.getElementById("map_canvas"), 
     mapOptions); 

Answer 2

我会检查Google Maps API。在那里提到一切。

Answer 3

这里是一个链接，您可以风格的地图：http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/wizard/index.html

我只是做了这一个，它应该看起来非常相似。

var styles = [ 
    { 
    "featureType": "road.arterial", 
    "stylers": [ 
     { "color": "#a0a0a0" }, 
     { "visibility": "on" } 
    ] 
    },{ 
    "featureType": "road.highway", 
    "stylers": [ 
     { "color": "#c9c8c8" } 
    ] 
    },{ 
    "featureType": "landscape", 
    "elementType": "geometry.fill", 
    "stylers": [ 
     { "color": "#e3e3e3" } 
    ] 
    },{ 
    "featureType": "road", 
    "elementType": "labels.text.fill", 
    "stylers": [ 
     { "color": "#434443" }, 
     { "visibility": "on" } 
    ] 
    },{ 
    "featureType": "road", 
    "elementType": "labels.icon", 
    "stylers": [ 
     { "visibility": "off" } 
    ] 
    },{ 
    "featureType": "water", 
    "elementType": "geometry.fill", 
    "stylers": [ 
     { "color": "#f7f9fb" } 
    ] 
    },{ 
    "featureType": "road", 
    "elementType": "labels.text.stroke", 
    "stylers": [ 
     { "color": "#ffffff" } 
    ] 
    },{ 
    "featureType": "poi", 
    "elementType": "geometry.fill", 
    "stylers": [ 
     { "color": "#d6d5d5" }, 
     { "visibility": "on" } 
    ] 
    },{ 
    "featureType": "poi", 
    "elementType": "labels.text.fill", 
    "stylers": [ 
     { "color": "#434443" } 
    ] 
    },{ 
    } 
]; 

map.setOptions({styles: styles});