title: How to apply Cluster Source for Circle geom in openlayers?
body: <p>I'm trying to apply <a href="https://openlayers.org/en/latest/apidoc/module-ol_source_Cluster-Cluster.html" rel="nofollow noreferrer">clustering</a> to circle features. Having read the documentation it seems that for anything different then a point a <em>geometryFunction</em> needs to be defined: my attempt looks like this:</p>
  <pre><code>var source = new ol.source.Vector({wrapX: false});
  
  var clusterSource = new ol.source.Cluster({
      geometryFunction: function(feature){
          let circlePoint = new ol.geom.Point(feature.getGeometry().getCenter());
          return circlePoint;
      },
      distance: 0,
      source: source,
  });
  
  var vector = new ol.layer.Vector({
    source: clusterSource,
    style: function(feature, resolution) {
          var styles = [style1];
          if (feature.getGeometry().getType() == 'Circle') {
              style2.setGeometry(new ol.geom.Point(feature.getGeometry().getCenter()));
              style2.getImage().setScale(feature.getGeometry().getRadius() / (180 * resolution));
              styles.push(style2);
          }
          return styles;
      },
      updateWhileAnimating: true,
      visible: true
  
  });
  </code></pre>
  <p>and an example feature I add:</p>
  <pre><code>circle = new ol.geom.Circle(ol.proj.transform([_lon, _lat], 'EPSG:4326', 'EPSG:3857'), 1);
  feature=new ol.Feature({
  geometry: circle
  });
  </code></pre>
  <p>I tried this with 5000 circles with different distance argument for the cluster, and it shows them at first load then they disappear when I change zoom level. Any idea what I'm doing wrong?</p>
  <p>Edit: styles used:</p>
  <pre><code>var style1 = new ol.style.Style({
          fill: new ol.style.Fill({
              color: 'rgba(0, 255,0, 0.3)'
          }),
          stroke: new ol.style.Stroke({
              color: '#737373',
              width: 2
          })
      });
  var style2 = new ol.style.Style({
          image: new ol.style.Icon({
              src: 'https://www.freeiconspng.com/uploads/photoshop-tree-top-view-png-3.png'
          })
      });
  </code></pre>