将Openlayers 2 BBOX策略迁移到Openlayers 3

时间:2016-10-29 22:44:05

标签: openlayers openlayers-3

我将地图应用程序从Openlayers 2迁移到ol3,并且有一个bbox层,当范围发生变化时,它会向服务器发出请求。我使用刷新策略(使用force:true),服务器返回我使用自定义格式处理的对象数组。

var refreshStrategy = new OpenLayers.Strategy.Refresh({
  force: true
});

OpenLayers.Format.GTFS = OpenLayers.Class(OpenLayers.Format, {
  read: function(body) {
    var stops = JSON.parse(body), point, features = [];

    for(var i=0,l=stops.length; i<l; i++) {
      point = new OpenLayers.Geometry.Point(stops[i].stop_lon, stops[i].stop_lat);
      features.push(new OpenLayers.Feature.Vector(point, stops[i]));
    }
    return features;
    }
});

var layer = new OpenLayers.Layer.Vector('Stops', {
  projection: new OpenLayers.Projection('EPSG:4326'),
  visibility: true,
  strategies: [
    new OpenLayers.Strategy.BBOX({resFactor: 1.2}),
    refreshStrategy
    ],
  protocol: new OpenLayers.Protocol.HTTP({
    format: new OpenLayers.Format.GTFS(),
    url: '/api/v1/stops.json'
  })
});

refreshStrategy.activate();

似乎ol.source.Vector仅支持单一策略。我尝试只使用bbox策略,但每次平移时都会重新加载功能标记闪烁和数据

var stopFeatures = new ol.Collection();

var source = new ol.source.Vector({
    features: stopFeatures,
    loader: function(extent, resolution, projection) {
        extent = ol.extent.applyTransform(extent, ol.proj.getTransform("EPSG:3857", "EPSG:4326"));
        var url = '/api/stops.json?bbox=' + extent.join(',');
        $http.get(url).then(function (res) {
            var features = _.map(res.data, function (stop) {
                var stopFeature = new ol.Feature(stop);
                stopFeature.setGeometry(new ol.geom.Point(ol.proj.transform([stop.stop_lon,stop.stop_lat],
                    'EPSG:4326', 'EPSG:3857')));
                return stopFeature;
            });
            stopFeatures.clear();
            stopFeatures.extend(features);
        });
    },
    projection: 'EPSG:4326',
    strategy: ol.loadingstrategy.bbox,
});

清除和重置功能集合感觉就像我做错了一样,刷新似乎更慢。

map.on('moveend',...是否可以在ol3上实现此功能?

1 个答案:

答案 0 :(得分:1)

你是对的 - 你不应该在功能集上调用clear()extend()。相反,您应该为JSON中的每个功能提供类似唯一ID的内容。如果不这样做,您可以使用从纬度和经度创建的哈希。获得ID后,请使用stopFeature.setId(id)在功能上设置ID。然后只需致电source.addFeatures(features)。该策略将在内部将特征ID与现有特征的ID进行比较,并仅将这些特征与已经不在源中的ID一起插入。