如何将 Circles 绑定到 Markers 以便它由 Marker-Clusterer 管理？ Angular Google 地图组件

Question

我实际上想要实现的是为每个不在集群内的标记显示一个 MapCircle，当它在一个集群内时将其隐藏。

我知道我可以将图钉设计成圆形）但我需要显示精确的半径，这样我可以避免多次计算形状大小。

Clustered Img Declustered Img

提前致谢！

Answer 1

我设法部分解决了这个问题，我不需要监听任何由“map-marker-clusterer”触发的事件。

标记由集群通过标记的“地图”属性管理（如果它有地图，它会显示标记）。因此，我发现了为什么在地图上还添加了一个图钉以及集群大小的问题......当我创建一个标记时，我为标记指定了“地图”。

现在关于标记周围的圆圈，您可以为每个标记创建一个圆并将标记的位置绑定到圆心。

 <google-map width="100%" height="100%">
        <map-marker-clusterer [averageCenter]="true" #clusterer>
          <map-marker *ngFor="let marker of markers" [visible]="false" [position]="marker.getPosition()"></map-marker>
        </map-marker-clusterer>
        <map-circle *ngFor="let circle of circles" [center]="circle.getCenter()" [radius]="100"></map-circle>
      </google-map>

但是我还是想不通怎么把圆图绑定到marker map上属性也由集群管理（创建集群时隐藏） ) 圆圈没有“地图”属性但 CircleOptions 有一个。（导入 CircleOptions = google.maps.CircleOptions）

       const marker = new Marker({
        position: new MapCoordinates(address.lat, address.lng) 
       });

      const circle = new Circle();
      circle.bindTo('center', marker, 'position'); //Works like a charm


      circle.bindTo('map', marker, 'map'); // Doesn't work

更新：

我什至尝试扩展 Circle class 并为所谓的地图属性定义 getter 和 setter，我在其中尝试使用地图值设置选项。代码未被触发。
我已经尝试为标记上的“map_changed”事件添加一个侦听器，但它没有命中我的调试器，我希望在回调中能够以某种方式改变 Circle
的可见性

如何将 Circles 绑定到 Markers 以便它由 Marker-Clusterer 管理？ Angular Google 地图组件

How to bind Circles to Markers so it will get managed by the Marker-Clusterer ? Angular GoogleMaps Component

angular

typescript

google-maps-api-3

markerclusterer

angular12