web端学习

web高德地图 添加标注图层(LabelsLayer)及添加 L

2019-05-09  本文已影响299人  my木子

功能要求地图上的覆盖物部分动态更新,所有把不变化的部分放到新图层上,需要动态更新的部分直接清除map.clearMap(), 这样就互相不影响了。

// 地图版本 1.4.14
 // 添加图层
      var layer = new AMap.LabelsLayer({
          zooms: [3, 20],
          zIndex: 999,
          opacity: 1
      });
      map.add(layer);

//  添加 LabelMarker 类(自v1.4.14新增)
    labelMarker = new AMap.Marker({
        position: [value.longitude, value.latitude],
        opacity: 1,
        zooms:[3,20],
        icon: {
            image: "img/ship.png",
            size: [10,20],  //图标大小
            clipOrigin:[0,0],
            anchor:"bottom-center",
             retina:true
        },
        text:{
            "content":value.shipName,
            "direction":"top",
            "offset":[0,0],
            "style":{
                 "fontSize":12,
                 "fillColor":"#666",
                 'strokeColor': 'white',
                 'strokeWidth': '5',
             }
        },
        extData:{
            index:index
         }
});
layer.add(labelMarker);

// 给覆盖物添加点击事件
myIcon.on("click", function (e) {
    console.log(e);                                   
});
上一篇 下一篇

猜你喜欢

热点阅读