示例中心
功能在线体验
控制台
您现在的位置: 开发 > 地图 JS API > 教程 > 地图 > 覆盖物/图层管理 >

高德 开发 地图 JS API 教程 地图 覆盖物/图层管理

更新时间:2018年05月29日

本章为您介绍覆盖物 / 图层添加、获取、移除的方法,包括

  1. 添加 / 获取 / 移除覆盖物
  2. 添加 / 设置 / 获取 / 移除图层

添加 / 获取 / 移除覆盖物

添加覆盖物

覆盖物有多种类型,包括点标记、矢量图形、信息窗体等,均可以使用add方法添加。

// 构造点标记
var marker = new AMap.Marker({
    icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
    position: [116.405467, 39.907761]
});
// 构造矢量圆形
var circle = new AMap.Circle({
    center: new AMap.LngLat("116.403322", "39.920255"), // 圆心位置
    radius: 1000,  //半径
    strokeColor: "#F33",  //线颜色
    strokeOpacity: 1,  //线透明度
    strokeWeight: 3,  //线粗细度
    fillColor: "#ee2200",  //填充颜色
    fillOpacity: 0.35 //填充透明度
});

// 将以上覆盖物添加到地图上
// 单独将点标记添加到地图上
map.add(marker);
// add方法可以传入一个覆盖物数组,将点标记和矢量圆同时添加到地图上
map.add([marker,circle]);


获取覆盖物

可以使用getAllOverlays(type)方法获取已经添加的覆盖物。其中type参数类型包括marker、circle、polyline、polygon,缺省是返回以上所有类型所有覆盖物。

// 获取已经添加的覆盖物
map.getAllOverlays();

// 获取已经添加的marker
map.getAllOverlays('marker');


移除覆盖物

// 使用remove方法移除覆盖物,参数可以为单个覆盖物对象,也可以是一个包括多个覆盖物的数组
// 单独移除点标记
map.remove(marker);
// 同时移除点标记和矢量圆形
map.remove([marker,circle]);

// 使用clearMap方法删除所有覆盖物
map.clearMap();


添加 / 设置 / 获取 / 移除图层

添加图层

地图上可使用add方法添加各类型的图层,如高德官方的卫星、路网图层,第三方或是自定义图层等。

// 构造官方卫星、路网图层
var layer1 = new AMap.TileLayer.Satellite();
var layer2 =  new AMap.TileLayer.RoadNet();
var layers = [
    layer1,
    layer2
]
// 添加到地图上
map.add(layers);


设置图层

可以使用setLayers方法设置图层,使用该方法后,地图图层会被重置。

// 构造官方卫星、路网图层
var layers =  [
    new AMap.TileLayer.Satellite(),
    new AMap.TileLayer.RoadNet()
]
// 地图上设置图层
map.setLayers(layers);


获取图层

可以通过getLayers方法获取地图图层数据

// 获取地图图层数据
map.getLayers();

移除图层

通过remove方法移除地图图层

// 移除一个图层
map.remove(layer1);



移动端
示例中心
功能
在线体验
常见问题