Openlayers 4.5 ImageVector点自动聚类

时间:2017-11-29 23:07:52

标签: openlayers

OL版本4.5:https://jsfiddle.net/70kd51gh/1/ OL版本4.0.1:https://jsfiddle.net/7zs5dqcm/2/

两个jfiddles中的代码完全相同,唯一的区别是正在使用的OL版本。出于某种原因,版本4.5不允许功能相互重叠,您可以放大和缩小并观看它们消失。版本4.0.1一切都按预期工作。但是,由于修复了无关的错误,我无法降级到4.0.1。

该问题特定于ol.layer.Image,因为ol.layer.Vector允许重叠。但是,出于性能原因,我需要使用ol.source.ImageVector。

是否有解决方法允许这些功能相互重叠?

var pointstyle = new ol.style.Style({
    image: new ol.style.Circle({
        radius: 7,
        fill: new ol.style.Fill({
            color: '#00ff00'
        }),
        stroke: new ol.style.Stroke({
            color: '#000',
            width: 1
        })
    })
});


var styleKeys = ['x', 'cross', 'star', 'triangle', 'square'];
var count = 250;
var features = new Array(count);
var e = 4500000;
for (var i = 0; i < count; ++i) {
  var coordinates = [2 * e * Math.random() - e, 2 * e * Math.random() - e];
  features[i] = new ol.Feature(new ol.geom.Point(coordinates));
}

var source = new ol.source.Vector({
  features: features
});

var vectorLayer = new ol.layer.Image({
  source: new ol.source.ImageVector({source: source, style: pointstyle})
});

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

1 个答案:

答案 0 :(得分:3)

从v4.5.0中弃用

ol.source.ImageVector 检查upgrade note

将您的代码修复为:

var vectorLayer = new ol.layer.Vector({
  renderMode: 'image',
  source: source,
  style: pointstyle
});