聚合物風格谷歌地圖

風格如何應用於聚合物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

聚合物風格谷歌地圖

回答

相關問題