實例方法

專門支援資料與渲染器的動態更新,調用 new mapPlus.DynamicCluster(options),開始使用動態叢集圖。

實例方法描述
setData設定資料,並更新動態叢集。
setMarkerRenderer設定地標渲染器,並更新動態叢集。
setOnClusterClick設定叢集圖點選事件。
setOnMarkerClick設定地標點選事件。
remove移除動態叢集。

setData

setData(data)

設定資料,並更新動態叢集。

範例

javascript
const dynamicCluster = new mapPlus.DynamicCluster({  markerRenderer,});
const data = [  { id: 'a', position: [121.52012916930945, 25.029326932236182] },  { id: 'b', position: [121.52412916930945, 25.026326932236182] },  { id: 'c', position: [121.52612916930945, 25.027326932236182] },  { id: 'd', position: [121.52812916930945, 25.025326932236182] },  { id: 'e', position: [121.53012916930945, 25.022326932236182] },];
// 設定資料dynamicCluster.setData(data);

setMarkerRenderer

setMarkerRenderer(renderer)

設定地標渲染器,並更新動態叢集。

範例

javascript
const dynamicCluster = new mapPlus.DynamicCluster({  data,});
// 設定地標渲染器dynamicCluster.setMarkerRenderer(({ id, position }) => {  return {    key: id,    position,  };})

setOnClusterClick

setOnClusterClick(clusterClickHandler)

設定叢集圖點選事件。

範例

javascript
const dynamicCluster = new mapPlus.DynamicCluster({  data,  markerRenderer,});
// 設定叢集圖點選事件dynamicCluster.setOnClusterClick(({ properties }) => {  const { point_count } = properties;  alert('一共有' + point_count + '個地標在這裡!');});

setOnMarkerClick

setOnMarkerClick(markerClickHandler)

設定地標點選事件。

範例

javascript
const data = [  { id: 'a', position: [121.52012916930945, 25.029326932236182] },  { id: 'b', position: [121.52412916930945, 25.026326932236182] },  { id: 'c', position: [121.52612916930945, 25.027326932236182] },  { id: 'd', position: [121.52812916930945, 25.025326932236182] },  { id: 'e', position: [121.53012916930945, 25.022326932236182] },];
const dynamicCluster = new mapPlus.DynamicCluster({  data,  markerRenderer,});
// 設定地標點選事件dynamicCluster.setOnMarkerClick(({ event , marker , options }) => {  const infoWindow = new mapPlus.InfoWindow({    content: `This is ${options.id}`,  });  infoWindow.open({ anchor: marker });});

remove

remove()

移除動態叢集。

範例

javascript
const dynamicCluster = new mapPlus.DynamicCluster({  data,  markerRenderer,});
// 移除動態叢集dynamicCluster.remove();