覆盖物/图层管理最后更新时间: 2023年03月27日

本章为您介绍覆盖物 / 图层添加、获取、移除的方法，及如何对一组覆盖物集合进行操作，包括

添加 / 获取 / 移除覆盖物
添加 / 设置 / 获取 / 移除图层
覆盖物集合 OverlayGroup
GeoJSON类 GeoJSON

添加 / 获取 / 移除覆盖物

添加覆盖物

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

// 构造点标记
var marker = new AMap.Marker({
    icon: "https://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);

覆盖物群组

覆盖物群组 OverlayGroup

当用户需要对一组覆盖物集合做整体操作时，可以使用 AMap.OverlayGroup 类创建的实例来操作，以避免通过循环来一个个设置属性。

// 覆盖物1
var polyline1 = new AMap.Polyline({
    path: [
        new AMap.LngLat("116.368904","39.913423"),
        new AMap.LngLat("116.382122","39.901176"),
   ]
});

// 覆盖物2
var polyline2 = new AMap.Polyline({
    path: [
        new AMap.LngLat("116.387271","39.912501"),
        new AMap.LngLat("116.398258","39.904600")
    ]
});

// 创建覆盖物群组，传入覆盖物组成的数组
var overlayGroup = new AMap.OverlayGroup([polyline1, polyline2]);

// 对此覆盖物群组设置同一属性
overlayGroup.setOptions({
    strokeColor: 'red',
    strokeWeight: 5
});

// 统一添加到地图实例上
map.add(overlayGroup);

// 同时也可以对群组进行统一的展示隐藏操作
overlayGroup.show();
overlayGroup.hide();

此外，如果已经将 overlayGroup 加入到地图实例中了以后，新加入到 overlayGroup 里的覆盖物也会自动被添加到该地图实例中，移除时也相同。

var polyline3 = new AMap.Polyline({
    path: [
        new AMap.LngLat("116.387271","39.912501"),
        new AMap.LngLat("116.398258","39.904600")
    ]
});

// 添加新的覆盖物到群组
overlayGroup.addOverlay(polyline3);

// 移除群组中的一个覆盖物
overlayGroup.removeOverlay(polyline1);

查看更多属性和方法

GeoJSON类 GeoJSON

GeoJSON 类继承自 OverLayGroup，也是对一组覆盖物群组进行操作的类。不同的是，这里是将 GeoJSON 类型的数据转换成 OverlayGroup 后再指定方法绘制覆盖物群组。通过指定 getMarker， getPolyline 等属性，就可以拿到转换后的数据来绘制相应的覆盖物。具体方法如下：

// 创建 geoJSON 实例
var geoJson = new AMap.GeoJSON({
    geoJSON: JSON.parse(geoJsonData),   // GeoJSON对象
    getPolygon:  function(geojson, lnglats) {//还可以自定义getMarker和getPolyline
        
        return new AMap.Polygon({
            path: lnglats,
            fillOpacity: .8,
            strokeColor:'white',
            fillColor:'red'
        });   
    }
}); 

map.add(geoJson);