聚合物风格谷歌地图

风格如何应用于聚合物1谷歌地图标签？聚合物风格谷歌地图

该文档建议可以通过标签上的'styles'属性传入object of styles。

然而，使用类似this这在以前没有问题时，工作，作风不被装载块。

我已经试过与对象（而不是一个数组）代替从snazzymaps的代码，但这是行不通的。

2015-09-04 Lloyd Jones

它应该工作。你确定你正确传递你的样式对象吗？

这给你一个样式化地图：

<google-map latitude="37.779" longitude="-122.3892" 
    min-zoom="9" max-zoom="11" language="en" 
styles='[{"featureType":"landscape","stylers":[{"hue":"#FFBB00"},{"saturation":43.400000000000006},{"lightness":37.599999999999994},{"gamma":1}]},{"featureType":"road.highway","stylers":[{"hue":"#FFC200"},{"saturation":-61.8},{"lightness":45.599999999999994},{"gamma":1}]},{"featureType":"road.arterial","stylers":[{"hue":"#FF0300"},{"saturation":-100},{"lightness":51.19999999999999},{"gamma":1}]},{"featureType":"road.local","stylers":[{"hue":"#FF0300"},{"saturation":-100},{"lightness":52},{"gamma":1}]},{"featureType":"water","stylers":[{"hue":"#0078FF"},{"saturation":-13.200000000000003},{"lightness":2.4000000000000057},{"gamma":1}]},{"featureType":"poi","stylers":[{"hue":"#00FF6A"},{"saturation":-1.0989010989011234},{"lightness":11.200000000000017},{"gamma":1}]}]'> 
</google-map>

来源

2015-10-07 03:53:17

您是否使用单引号的styles财产？即styles=''而不是styles=""

这就是为我工作。

来源

2016-08-31 16:11:40 willsquire

我找不到如何给该对象通过style变量的值内的任何答案，但我可以通过在文件中读取评论“谷歌map.html”应用样式：

<script> 

var map = document.querySelector('google-map'); 

map.styles = [ 

    { 

     stylers: [ 

      {saturation: -100} 

     ] 

    }, 

    { 

     featureType: 'water', 

     stylers: [ 

      {color: '#1d5068'} 

     ] 

    } 

];

来源

2017-05-04 13:31:24

我正在尝试您的方法，因为我需要从脚本中分配样式，但目前为止还不适用于我。任何提示？ –

@Fausto R.，你能用你的代码创建一个jsfiddle并在这里分享吗？ –

对不起@DianCarlos的延迟，我错过了你的问题。我现在找不到我之前做错了什么，但是我终于在ma-ready事件函数中使用了一种不同的方法，为了以防万一，我将在下面发布代码作为答案。 –

扩大在我以前的评论/回答殿卡洛斯，这里是我的代码最终使用

假设styledMapDef持有地图样式定义对象

var styledMapType = new google.maps.StyledMapType(styledMapDef, {name: 'Styled'}); 
this.map.setOptions({"mapTypeControl":"true","mapTypeControlOptions":{"position":"3", "mapTypeIds": ["roadmap", "satellite", "hybrid", "terrain", "styled"]}, "scaleControl": "true"}); 
this.map.mapTypes.set('styled', styledMapType); 
this.map.setMapTypeId('styled');

来源

2017-07-06 19:02:34

聚合物风格谷歌地图

回答

相关问题