如何使用 bbox 加载 Open layers 3 geojson 矢量层?

pio*_*otr 3 javascript json vector layer openlayers-3

我正在努力构建 OL3 Vector layer BBOX 策略加载。到目前为止,我可以使用有效的 json 语法轻松加载 Geojson 文件,但这是一次性策略。我的另一种方法是使用 ol.ServerVector ,对于我的理解,它会通过回调返回 Javascript,但我无法使其工作。

工作简单的 Geojson 层:

var vectorSource = new ol.source.GeoJSON(
({
  projection: 'EPSG:3857',
  preFeatureInsert: function(feature) {
    feature.geometry.transform('EPSG:4326', 'EPSG:3857');
  },
  url: 'geojson2.json'
}));
Run Code Online (Sandbox Code Playgroud)

var vectorLayer = new ol.layer.Vector({ source: vectorSource, style: styleFunction });

BBOX 尝试(移动时返回 json,但功能未加载到地图):

    var vectorSource = new ol.source.ServerVector({
  format: new ol.format.GeoJSON(),
  loader: function(extent, resolution, projection) {
    var url = 'geojson2.php?p='+
        extent.join(',');
    $.ajax({
      url: url
    });
  },
  strategy: ol.loadingstrategy.bbox,
  projection: 'EPSG:3857',

});
// callback ?
var loadFeatures = function(response) {
  vectorSource.addFeatures(vectorSource.readFeatures(response));
};
Run Code Online (Sandbox Code Playgroud)

JSON 响应示例:

{"type":"FeatureCollection","features":[
{"type":"Feature","geometry":{"type":"Point","coordinates":[0,0]},"properties":{"label":"122.234-10/163"}},
{"type":"Feature","geometry":{"type":"Point","coordinates":[1,1],"properties":{"label":"132.222-1126"}}}
]}
Run Code Online (Sandbox Code Playgroud)

Wit*_*tle 5

为了使用最新版本的 OL3 (v3.7.0),我必须使用 GeoJSON 格式类读取功能。

var geoJSONFormat = new ol.format.GeoJSON();

var vectorSource = new ol.source.Vector({
  loader: function(extent, resolution, projection) {
    var url = 'geojson2.php?p=' + extent.join(',');
    $.ajax({
      url: url,
      success: function(data) {
        var features = geoJSONFormat.readFeatures(data);
        vectorSource.addFeatures(features);
      }
    }); 
  },
  strategy: ol.loadingstrategy.bbox
});
Run Code Online (Sandbox Code Playgroud)