Add ol.source.Cluster#setDistance function

examples/cluster.html

@@ -7,3 +7,7 @@ docs: >
 tags: "cluster, vector"
 ---
 <div id="map" class="map"></div>
+<form>
+  <label>cluster distance</label>
+  <input id="distance" type="range" min="0" max="100" step="1" value="40"/>
+</form>

examples/cluster.js

@@ -14,6 +14,8 @@ goog.require('ol.style.Style');
 goog.require('ol.style.Text');
 
 
+var distance = document.getElementById('distance');
+
 var count = 20000;
 var features = new Array(count);
 var e = 4500000;
@@ -27,7 +29,7 @@ var source = new ol.source.Vector({
 });
 
 var clusterSource = new ol.source.Cluster({
-  distance: 40,
+  distance: parseInt(distance.value, 10),
   source: source
 });
 
@@ -74,3 +76,7 @@ var map = new ol.Map({
     zoom: 2
   })
 });
+
+distance.addEventListener('input', function() {
+  clusterSource.setDistance(parseInt(distance.value, 10));
+});

src/ol/source/cluster.js

@@ -69,7 +69,7 @@ ol.source.Cluster = function(options) {
   this.source_ = options.source;
 
   this.source_.on(ol.events.EventType.CHANGE,
-      ol.source.Cluster.prototype.onSourceChange_, this);
+      ol.source.Cluster.prototype.refresh_, this);
 };
 ol.inherits(ol.source.Cluster, ol.source.Vector);
 
@@ -99,11 +99,22 @@ ol.source.Cluster.prototype.loadFeatures = function(extent, resolution,
 };
 
 
+/**
+ * Set the distance in pixels between clusters.
+ * @param {number} distance The distance in pixels.
+ * @api
+ */
+ol.source.Cluster.prototype.setDistance = function(distance) {
+  this.distance_ = distance;
+  this.refresh_();
+};
+
+
 /**
  * handle the source changing
  * @private
  */
-ol.source.Cluster.prototype.onSourceChange_ = function() {
+ol.source.Cluster.prototype.refresh_ = function() {
   this.clear();
   this.cluster_();
   this.addFeatures(this.features_);

test/spec/ol/source/cluster.test.js

@@ -19,6 +19,7 @@ describe('ol.source.Cluster', function() {
       });
       expect(source).to.be.a(ol.source.Source);
       expect(source).to.be.a(ol.source.Cluster);
+      expect(source.distance_).to.be(20);
     });
   });
 
@@ -63,4 +64,17 @@ describe('ol.source.Cluster', function() {
       expect(source.getFeatures()[0].get('features').length).to.be(2);
     });
   });
+
+  describe('#setDistance', function() {
+    it('changes the distance value', function() {
+      var source = new ol.source.Cluster({
+        distance: 100,
+        source: new ol.source.Vector()
+      });
+      expect(source.distance_).to.be(100);
+      source.setDistance(10);
+      expect(source.distance_).to.be(10);
+    });
+  });
+
 });