此处地图放大集群单击

Question

我在 Here Maps 实例上使用聚类，它可以工作，显示聚类，但当我单击其中一个以显示包含的标记时，我找不到缩放的方法。是否可能或唯一的方法是使用鼠标滚轮或缩放按钮手动缩放？

这就是我创建集群并将其显示在地图上的方式

let map = new H.Map(document.getElementById('map'),
            defaultLayers.normal.map,{
                center: {lat:{{ $map_center['lat'] }}, lng:{{ $map_center['lng'] }}},
                zoom: 4
        });

let sCluster = [];

// the coordinates come from an AJAX call
$.each(data,function(i, v) {
    let coord = {lat:parseFloat(v["lat"]),lng:parseFloat(v["lng"])};

    sCluster.push(new H.clustering.DataPoint(parseFloat(v["lat"]),parseFloat(v["lng"])));
});

let clusteredSugProvider = new H.clustering.Provider(sCluster,{
    clusteringOptions: {
        strategy: H.clustering.Provider.Strategy.GRID,
        eps: 64,
        minWeight: 2
    }
});

let layer = new H.map.layer.ObjectLayer(clusteredSugProvider);

map.addLayer(layer);

Answer 1

我已经找到了如何在单击群集图标时进行缩放，这是我的解决方案：

// add a listener to the cluster which triggers on a tap event
clusteredSugProvider.addEventListener('tap', function (evt) {

  // get the data of the object clicked
  let cnt = evt.target.getData();

  // if those data contain a data object it was a marker to be clicked
  // mine has a string (not yet set in the code above) which I show inside an InfoBubble
  if (typeof cnt.a.data !== 'undefined') {
      let bubble = new H.ui.InfoBubble(evt.target.getPosition(), {
          content: cnt.a.data.content
      });
      ui.addBubble(bubble);
  } else {
      // otherwise it was a cluster icon which doesn't contain a data object
      // set the map center to the coordinates where the user clicked
      // "true" is to have a smooth transition
      map.setCenter(
          map.screenToGeo(
              evt.currentPointer.viewportX,
              evt.currentPointer.viewportY
          ),
          true
      );
    
      // increase the zoom level by an amount which fits your needs
      // again "true" is to have a smooth transition
      const zoomIn = () => {
          map.setZoom(map.getZoom() + 2, true);
          map.removeEventListener('mapviewchangeend', zoomIn);
      };

      map.addEventListener('mapviewchangeend', zoomIn);
  }
}, false);