Question

我正在尝试学习如何使用API，而且我正在完全关注他们网站上的代码，但出于某种原因，它只是不想改变颜色。

我发布的代码只是从他们的网站上复制并粘贴但是我无法让它工作，任何人都可以告诉我我做错了什么？

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>maps</title>

    <style>
        html, body {
            height: 100%;
            margin: 0;
            width: 100%;

            }
        #map{
            height: 100%;
            margin: 0;
            width: 100%;
            background-color: red;
            }
    </style>

</head>
<body>

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

<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

<script>
var map;
function initialize() {
  var mapOptions = {
    zoom: 8,
    center: new google.maps.LatLng(-34.397, 150.644),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById('map'),
      mapOptions);
}

google.maps.event.addDomListener(window, 'load', initialize);


var styleArray = [
  {
    featureType: "all",
    stylers: [
      { saturation: -80 }
    ]
  },{
    featureType: "road.arterial",
    elementType: "geometry",
    stylers: [
      { hue: "#00ffee" },
      { saturation: 50 }
    ]
  },{
    featureType: "poi.business",
    elementType: "labels",
    stylers: [
      { visibility: "off" }
    ]
  }
];
</script>
</body>
</html>

Answer 1

您必须将样式应用于地图：

var mapOptions = {
        zoom: 8,
        center: new google.maps.LatLng(-34.397, 150.644),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        styles: styleArray
      };

Google Maps API颜色样式器无法正常工作

1 个答案: