Google Maps API颜色修改器无效 [英] Google Maps API color stylers not working

查看:118
本文介绍了Google Maps API颜色修改器无效的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试学习如何使用API​​,并且完全遵循其网站上的代码,但出于某种原因,它只是不想更改颜色。

我发布的代码只是从他们的网站复制并粘贴,但我无法使用它,任何人都可以告诉我我做错了什么?

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

< style>
html,body {
height:100%;
保证金:0;
宽度:100%;

}
#map {
height:100%;
保证金:0;
宽度:100%;
背景颜色:红色;
}
< / style>

< / head>
< body>

< div id =map>< / div>

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

< script>
var map;
函数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}
$ b $ {b $ b featureType:road.arterial,
elementType:geometry,
stylers:[
{hue:#00ffee },
{saturation:50}
]
},{
featureType:poi.business,
elementType:labels,
stylers :[
{visibility:off}
]
}
];
< / script>
< / body>
< / html>


解决方案

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

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


I'm trying to learn how to use the API, and I'm following the code that's on their site completely but for some reason it just doesn't want to change colour.

The code I'm posting is just copy and pasted from their website but I cannot get it to work, can any one please tell me what I'm doing wrong?

<!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>

解决方案

You must apply the style to the map:

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

这篇关于Google Maps API颜色修改器无效的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆