高德地图点聚合自定义样式点击事件失效怎么办？

自定义样式的点聚合点击事件失效问题探究

在使用高德地图进行点聚合时，开发者常常需要自定义聚合点的样式，并为其添加点击事件，例如改变样式或添加class。然而，一个常见的问题是：当地图进行缩放或平移操作后，自定义的点击样式会失效，恢复到原始状态。本文将深入探讨这个问题的原因以及解决方案。

问题描述：

用户在使用高德地图点聚合功能并自定义样式后，为聚合点添加了点击事件，例如通过添加class或改变样式来实现视觉反馈。但令人困扰的是，当地图缩放或平移后，这些自定义的样式会消失，点击事件的效果也随之失效。

问题分析与解决方法：

造成此问题的原因在于，地图缩放或平移操作会触发所有标记（marker）的重新渲染。在重新渲染的过程中，之前自定义的样式和点击事件状态会被重置。

为了解决这个问题，我们可以通过在自定义渲染函数renderclustermarker中添加判断逻辑来实现。具体方法是在点击事件发生时，记住被点击的marker，然后在renderclustermarker函数中判断当前渲染的marker是否为被点击的marker，如果是，则为其添加自定义样式。

以下代码片段展示了如何在renderclustermarker函数中进行判断并应用自定义样式：

renderClusterMarker: function (context) {    var div = document.createElement('div');    div.style.backgroundColor = 'rgba(255,0,0,1)';    // ...    div.innerHTML = context.count;    if(context.marker === clickMarker){        div.classList.add('xxx')    }    context.marker.setContent(div)}

登录后复制