javascript - Google map v3 隐藏元素(道路、路标等)

标签 javascript google-maps google-maps-api-3

我在 http://www.41latitude.com/post/1268734799/google-styled-maps 上找到了一个代码片段:

[
  {
    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" }
    ]
  }
]

我应该能够在我的 map 中使用它,但是有人可以告诉我如何使用这个片段吗?我在 Google Maps V3 的 API 中找不到任何相关信息。

最佳答案

@ceejayoz suggested in the other answer ,您正在尝试使用新的 Styled Map features v3 Maps API的。这是一个非常基本的示例,说明如何在简单的 map 中使用上述样式:

<!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这将允许您以图形方式编辑样式。

关于javascript - Google map v3 隐藏元素(道路、路标等),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4024672/

相关文章:

android - 自定义标记在某些设备上显示为白色(Google Maps v3 Android SDK)

javascript - JSON 显示基于 ID 的实际数据

javascript读取文件并将内容作为变量

javascript - 剪切 "<p></p>"内的字符串

java - 时间格式说明(Google Directions API)

javascript - Google Maps API JS - 使用两个组合字段放置自动完成

javascript - 通过 jQuery 添加后样式化类

javascript - React onClick 是否更像一个 JavaScript addEventListener 而不是一个标准的 JavaScript onclick 属性?

css - 需要在输入中获取一个值 id

ios - Google map ,使用 DispatchQueue 加载标记