使用WMS作为源的OpenLayer 6.3.1中的MarkerClusters

时间:2020-08-27 19:56:54

标签: javascript markerclusterer wms openlayers-6

我正在使用OpenLayer版本6.3.1,并且想知道如何使用WMS数据源来执行MarkerClusters。

我的问题是我不知道如何将群集与WMS链接。 WMS源是point.shp(在几何上)

我试图用WMS替换群集源,但是它不起作用。

这是我的代码

var ImageWMS = new ImageWMS({  
  url: 'http://localhost:8080/geoserver/ACCESSOINSMADA/wms',  
     params: {'LAYERS': 'ACCESSOINSMADA:csb2-pub', 'TILED': true},
     serverType: 'geoserver',
     transition: 0,
   
});
var ImageLayers = new ImageLayer({
    source: ImageWMS,
})

var distance = document.getElementById('distance');

var count = 20000;
var features = new Array(count);
var e = 3500000;
for (var i = 0; i < count; ++i) {
  var coordinates = [2 * e * Math.random() - e, 2 * e * Math.random() - e];
  features[i] = new Feature(new Point(coordinates));
}

var source = new VectorSource({
  features: features,
});

var clusterSource = new Cluster({
  distance: parseInt(distance.value, 10),
  source: source,
});

var styleCache = {};
var clusters = new VectorLayer({
  source: clusterSource,
  style: function (feature) {
    var size = feature.get('features').length;
    var style = styleCache[size];
    if (!style) {
      style = new Style({
        image: new CircleStyle({
          radius: 10,
          stroke: new Stroke({
            color: '#fff',
          }),
          fill: new Fill({
            color: '#3399CC',
          }),
        }),
        text: new Text({
          text: size.toString(),
          fill: new Fill({
            color: '#fff',
          }),
        }),
      });
      styleCache[size] = style;
    }
    return style;
  },
});

1 个答案:

答案 0 :(得分:0)

WMS输出通常是图像,因此您将无法更改数据并将其聚类到OpenLayers等客户端中;为此,您需要通过WFS来获取数据。

作为客户端中群集点的替代方法,可以将WMS配置为提供群集点。

有关示例,请参见:

WMS providing clustered points, shown in OpenLayers