Question

Azure Maps中的数据源可以将点要素（销）聚集在一定半径内。在此类群集上发生点击事件时，我想将边界框重置为群集所代表的区域，并放大以显示群集内的各个引脚。

使用Google Maps可以将群集的默认行为设置为在点击时自动缩放。在旧的Bing Maps API中，此功能也相对容易实现。如何在不使用大量JavaScript的情况下在Azure Maps中添加此功能？

Answer 1

实际上，Azure Maps似乎不直接支持它，可以考虑采用以下方法：

单击图层event后，将返回目标对象的像素位置以及其他属性。然后，通过min确定簇圆的max和atlas.Map.pixelsToPositions function坐标：

const coordinates = e.map.pixelsToPositions([
          [e.pixel[0] + (clusterRadius*2), e.pixel[1] + (clusterRadius*2)],
          [e.pixel[0] - (clusterRadius*2), e.pixel[1] - (clusterRadius*2)],
        ]);

然后可以通过atlas.data.BoundingBox.fromPositions function确定群集气泡中可能包含引脚的区域边界：

const bounds = atlas.data.BoundingBox.fromPositions(coordinates);

最后设置了地图视口：

 map.setCamera({
          bounds: bounds,
          padding:0
        });

这里是a demo供您参考

如何在群集单击事件上缩放Azure Maps边界框？

1 个答案: