我正在努力构建OL3矢量层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' }));
var vectorLayer = new ol.layer.Vector({ source: vectorSource, style: styleFunction });
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)); };
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"}}} ]}
您需要添加一个Ajax回调,以将功能部件添加到矢量源中:
var vectorSource = new ol.source.Vector({ format: new ol.format.GeoJSON(), loader: function(extent, resolution, projection) { var url = 'geojson2.php?p=' + extent.join(','); $.ajax({ url: url, success: function(data) { vectorSource.addFeatures(vectorSource.readFeatures(data)); } }); }, projection: 'EPSG:3857', strategy: ol.loadingstrategy.bbox });