当前位置: 代码迷 >> Web前端 >> 怎么在map上只显示道路名称,去除POI信息
  详细解决方案

怎么在map上只显示道路名称,去除POI信息

热度:544   发布时间:2013-12-23 14:30:52.0
如何在地图上只显示道路名称,去除POI信息
目前google 地图的API中包含featureType参数可以设置关闭POI信息。

百度地图最近刚出的自定义地图接口存在一个BUG。

http://developer.baidu.com/map/reference/index.php?title=Class:%E6%A0%B8%E5%BF%83%E7%B1%BB/MapStyle

features 设置地图上展示的元素种类,支持point(兴趣点)、road(道路)、water(河流)、land(陆地)、building(建筑物)。(自2.0新增)

这个参数不包括POI的时候,连道路的名字都不显示了。难道道路的名称都算POI吗?
问题已经反馈给百度了,不知道什么时候可以解决。

google map 接口地址 》》

https://developers.google.com/maps/documentation/javascript/reference?hl=zh-CN#MapTypeStyleFeatureType

<!DOCTYPE html>
<html>
  <head>
    <title>Simple styled maps</title>
    <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.9&sensor=false"></script>
    <script>
var map;
var brooklyn = new google.maps.LatLng(34.366,113.263);

var MY_MAPTYPE_ID = 'custom_style';

function initialize() {

  var featureOpts = [
    {
      featureType: 'poi',
      stylers: [
        {visibility: 'off' }
      ]
    }
  ];

  var mapOptions = {
    zoom: 12,
    center: brooklyn,
    mapTypeControlOptions: {
      mapTypeIds: [google.maps.MapTypeId.ROADMAP, MY_MAPTYPE_ID]
    },
    mapTypeId: MY_MAPTYPE_ID
  };

  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

  var styledMapOptions = {
    name: 'Custom Style'
  };

  var customMapType = new google.maps.StyledMapType(featureOpts, styledMapOptions);

  map.mapTypes.set(MY_MAPTYPE_ID, customMapType);
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>
  </head>
  <body>
    <div id="map-canvas"></div>
  </body>
</html>

  相关解决方案