From 988f3fa502e9e22adb477a9024f51a8a4ce1b7bf Mon Sep 17 00:00:00 2001
From: yukihiratype2 <yukihiratype2@live.com>
Date: Mon, 25 Jan 2021 18:10:01 +0800
Subject: [PATCH] Demonstrates how to get the coordinates been clustered.

---
 examples/cluster.js | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/examples/cluster.js b/examples/cluster.js
index 944e1116b2..48e1d0493c 100644
--- a/examples/cluster.js
+++ b/examples/cluster.js
@@ -11,6 +11,7 @@ import {
 } from '../src/ol/style.js';
 import {Cluster, OSM, Vector as VectorSource} from '../src/ol/source.js';
 import {Tile as TileLayer, Vector as VectorLayer} from '../src/ol/layer.js';
+import {boundingExtent} from '../src/ol/extent.js';
 
 const distance = document.getElementById('distance');
 
@@ -77,3 +78,18 @@ const map = new Map({
 distance.addEventListener('input', function () {
   clusterSource.setDistance(parseInt(distance.value, 10));
 });
+
+map.on('click', (e) => {
+  clusters.getFeatures(e.pixel).then((clickedFeatures) => {
+    if (clickedFeatures.length) {
+      // Get clustered Coordinates
+      const features = clickedFeatures[0].get('features');
+      if (features.length > 1) {
+        const extent = boundingExtent(
+          features.map((r) => r.getGeometry().getCoordinates())
+        );
+        map.getView().fit(extent, {duration: 1000, padding: [50, 50, 50, 50]});
+      }
+    }
+  });
+});