ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add a minimum distance config to the cluster source

Browse Source
This commit is contained in:
Maximilian Krög
2020-01-14 22:50:04 +01:00
parent c9ec2083d3
commit 1c4f525ca9
4 changed files with 144 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
examples/cluster.js
View File

@@ -13,7 +13,11 @@ 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');
const distanceInput = document.getElementById('distance');
const distanceNode = document.getElementById('distance-info');
const minDistanceInput = document.getElementById('min-distance');
const minDistanceNode = document.getElementById('min-distance-info');
const numClustersNode = document.getElementById('num-clusters');
const count = 20000;
const features = new Array(count);
@@ -28,9 +32,15 @@ const source = new VectorSource({
});
const clusterSource = new Cluster({
distance: parseInt(distance.value, 10),
distance: parseInt(distanceInput.value, 10),
minDistance: parseInt(minDistanceInput.value, 10),
source: source,
});
clusterSource.on('change', function (evt) {
numClustersNode.innerText = evt.target.features.length;
});
distanceNode.innerText = clusterSource.getDistance();
minDistanceNode.innerText = clusterSource.getMinDistance();
const styleCache = {};
const clusters = new VectorLayer({
@@ -75,8 +85,14 @@ const map = new Map({
}),
});
distance.addEventListener('input', function () {
clusterSource.setDistance(parseInt(distance.value, 10));
distanceInput.addEventListener('input', function () {
distanceNode.innerText = distanceInput.value;
clusterSource.setDistance(parseInt(distanceInput.value, 10));
});
minDistanceInput.addEventListener('input', function () {
minDistanceNode.innerText = minDistanceInput.value;
clusterSource.setMinDistance(parseInt(minDistanceInput.value, 10));
});
map.on('click', (e) => {