高德地图API-vue2/3，问题：点位消失、掩模、标注层避让

本文链接：https://blog.csdn.net/qq_40959492/article/details/135110301

文章讨论了在Vue应用中使用AMap时，labelMarker点位可能因标注层避让而消失的问题。作者提供了解决方案，即在labelMarker外包装一层图层并设置`collision`和`allowCollision`属性为`false`，确保点位始终可见。

摘要由CSDN通过智能技术生成

问题描述：

两个或多个点，相近或者会有重合的时候，只保留了一个点位，其他的都消失了，放大又会出现了。我想让点位一直都处于显示状态（不避让消失）。

问题分析：

一般在使用纯marker点位的时候相互之间不会出现消失现象，但是使用的有labelMarker的时候就会消失。实际上是叫：标注层避让。

解决方案：

首先lebelMarker外套一个图层。因为图层有属性，可以避免标注层避让。

collision：标注层内的标注是否避让；

allowCollision：标注层内的标注是否允许其它标注层对它避让；

vue内组件写法：

<el-amap-layer-labels
    :collision="false" 
    :allowCollision="false"
 >
   <el-amap-label-marker
     :position="labelOptions.position"
     :text="labelOptions.text"
     :icon="labelOptions.icon"
    />
</el-amap-layer-labels>

vue地图实例写法：

new AMap.LabelsLayer(配置属性{ }) ，两个属性写在配置里，

注意：把labelMarker添加在LabelsLayer实例中，然后再添加到地图实例。