How to cluster data (and not only the number of markers)

Question

I wanted to display some data (a number, different for each point) on a map (either Google maps or OpenStreetMap). Each point has an associated value (the number above).

For markers which are close to each other, the display is messy and the natural solution for this is to cluster the points.

While there several libraries or built-in mechanisms to cluster data points (including OpenLayers which seems to be very complete), all the ones I found display the number of markers in a cluster, without the possibility to display a sum of values carried by each point (or an average, or other functions which takes values an an input and transform them into one value).

Is there a library which would help with this problem? (in JavaScript for pure client-side rendering and ideally open source)

Answer 1

You can use OpenLayers to display each cluster marker's sum of children values. simply set a value to marker which will be clustered and set text option to cluster style. working example's here

1. add a value what you want into feature

   features[i] = new ol.Feature(new ol.geom.Point(coordinates));
   // 1. set its value
   features[i].value = i;

2. use the values when you set style

   var sum = 0;
   // 2. get sum of children
   for (var i = 0; i < size; i++) {
     sum += features[i].value;
   }

3. set text as the calculated value

   text: new ol.style.Text({
     text: sum.toString(), // 3. set sum as text
     fill: new ol.style.Fill({
       color: '#fff'
     })
   })