Question

是否可以使用新的Google地图javascript API更改地图的颜色，使其具有类似map under the light blue panel

的内容

Answer 1

样式地图可能就是您要找的地方，

首先值得一提的是向导（注意在＃9中，它应该是styles，而不是style）

https://mapstyle.withgoogle.com

这些是参考：

http://code.google.com/apis/maps/documentation/javascript/reference.html#StyledMapType

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

静态API中有一个样式化地图的示例 http://code.google.com/apis/maps/documentation/staticmaps/#StyledMaps

饱和度和亮度控制外观。饱和度较低=颜色较少，亮度较高=较白

<!DOCTYPE html>
<html>
  <head>
    <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;
      var grayStyles = [
        {
          featureType: "all",
          stylers: [
            { saturation: -90 },
            { lightness: 50 }
          ]
        },
      ];
      var mapOptions = {
        center: new google.maps.LatLng(41.325663, 19.8029607),
        zoom: 15,
        styles: grayStyles,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      };

      function initialize() {
        map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
      }

      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map_canvas"></div>
  </body>
</html>

Answer 2

一种方法是嵌入地图，然后用半透明图像覆盖它。它不会将颜色改变为灰度，但你可以将它淡出一点。然后用更高的z指数将所有内容放在上面。

这是不可取的，因为这会导致页面加载时间从屋顶射出！

更改谷歌地图的颜色

2 个答案: