openlayers Обновление кластеризированного слоя -- добавление элемента

Пример работающего года для версий 4.3 и 5.3

function getFromLonLat(lonLat) {
  return ol.proj.fromLonLat(
    [
      parseFloat(lonLat[1]),
      parseFloat(lonLat[0]) > 90 ? 90 : (parseFloat(lonLat[0]) < -90 ? -90 : parseFloat(lonLat[0]))
    ]
  );
}

var pin = new ol.Feature(new ol.geom.Point(getFromLonLat([50.952323, 172.732033])));


var source = new ol.source.Vector({});
var clusterSource = new ol.source.Cluster({
  distance: 40,
  source: source
});
var styleCache = [];
var layer = new ol.layer.Vector({
  source: clusterSource,
  style: function(feature, resolution) {
    var size = feature.get('features').length;
    var style = styleCache[size];
    if (!style) {
      style = [new ol.style.Style({
        image: new ol.style.Circle({
          radius: 10,
          stroke: new ol.style.Stroke({
            color: '#fff'
          }),
          fill: new ol.style.Fill({
            color: '#3399CC'
          })
        }),
        text: new ol.style.Text({
          text: size.toString(),
          fill: new ol.style.Fill({
            color: '#fff'
          })
        })
      })];
      styleCache[size] = style;
    }
    return style;
  }
});

var map = new ol.Map({
  layers: [layer],
  target: 'map',
  view: new ol.View({
    center: [0, 0],
    zoom: 2
  })
});

/* map.addLayer(layer); */
source.addFeature(pin);

Посмотреть на работу можно и тут: https://jsfiddle.net/buro14r/c2deho31/

Связанные обсуждения: