谷歌地圖V3隱藏要素（道路，路標等）

我發現了一個代碼片段上http://www.41latitude.com/post/1268734799/google-styled-maps：谷歌地圖V3隱藏要素（道路，路標等）

[ 
    { 
    featureType: "administrative", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    },{ 
    featureType: "poi", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    },{ 
    featureType: "water", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    },{ 
    featureType: "road", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    } 
]

我應該能夠在我的地圖中使用它，但有沒有人誰可以告訴我如何我可以使用這個片段？我在Google Maps V3的API中找不到任何關於它的信息。

來源

2010-10-26 Rene Terstegen

我真的沒有在頁面上看到了，它看起來像他們使用的是不同的道路底圖，衛星等等。他們按照已經詳細說明的方式操作樣式選項。 – Drew 2010-10-26 14:30:44

這是https://developers.google.com/maps/documentation/javascript/styling – BigJ 2017-10-26 23:35:44

由於@ceejayoz suggested in the other answer，你要使用的v3 Maps API的新Styled Map features。下面是你如何使用上面的樣式在簡單的地圖很簡單的例子：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps Dark Water Style Demo</title> 
    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script> 
</head> 
<body> 
    <div id="map" style="width: 550px; height: 300px;"></div> 

    <script type="text/javascript"> 
    var myStyle = [ 
     { 
     featureType: "administrative", 
     elementType: "labels", 
     stylers: [ 
      { visibility: "off" } 
     ] 
     },{ 
     featureType: "poi", 
     elementType: "labels", 
     stylers: [ 
      { visibility: "off" } 
     ] 
     },{ 
     featureType: "water", 
     elementType: "labels", 
     stylers: [ 
      { visibility: "off" } 
     ] 
     },{ 
     featureType: "road", 
     elementType: "labels", 
     stylers: [ 
      { visibility: "off" } 
     ] 
     } 
    ]; 

    var map = new google.maps.Map(document.getElementById('map'), { 
     mapTypeControlOptions: { 
     mapTypeIds: ['mystyle', google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.TERRAIN] 
     }, 
     center: new google.maps.LatLng(30, 0), 
     zoom: 3, 
     mapTypeId: 'mystyle' 
    }); 

    map.mapTypes.set('mystyle', new google.maps.StyledMapType(myStyle, { name: 'My Style' })); 
    </script> 
</body> 
</html>

截圖：

alt text

您可能還需要檢查出的Google Maps APIs Styling Wizard，這將讓你以圖形方式編輯樣式。

來源

2010-10-26 14:33:08

太棒了，這個例子是一個很好的例子，給了我解決方案。 – 2010-10-27 07:06:10

是否可以這樣做：'featureType：[「poi」，「transit」]'即選擇它們，然後同時禁用它們的全部可見性？ – user2019515 2013-12-24 16:34:01

是的，你可以使用'featureType：「all」 – GreatBittern 2014-08-05 19:54:01

您鏈接的頁面包含指向the Google Maps API documentation for this feature的鏈接。

來源

2010-10-26 14:29:26 ceejayoz

好的，錯過了鏈接。就像我的女朋友說的那樣：我是一個很好的搜索者，但是一個不好的發現者！ – 2010-10-27 07:42:59

我知道這是5歲，但我偶然發現，接受的解決方案比我認爲需要的複雜得多。由於在原崗位的JSON，你這是怎麼會將該樣式應用到現有的地圖：

var mapStyle = [ 
    { 
    featureType: "administrative", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    },{ 
    featureType: "poi", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    },{ 
    featureType: "water", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    },{ 
    featureType: "road", 
    elementType: "labels", 
    stylers: [ 
     { visibility: "off" } 
    ] 
    } 
] 

//create map 
var map = new google.maps.Map(...); //This assumes you already have a working map 

//set style 
map.set('styles', mapStyle);

來源

2015-12-22 20:40:26

谷歌地圖V3隱藏要素（道路，路標等）

回答

相關問題