矢量源的url
选项是加载矢量数据的首选,但当需要特殊的后处理或加载策略时,它无法工作。
https://openlayers.org/en/latest/apidoc/module-ol_source_Vector-VectorSource.html
加载策略#
首先,我们应该了解 openlayers 中的加载策略。openlayers 中有 3 种标准的加载策略。
all
:在一个请求中加载所有要素。bbox
:根据当前视图的范围和分辨率加载要素。tile
:基于瓦片网格加载要素,与all
或bbox
的区别在于它接受一个TileGrid
作为参数。
显然,bbox
是加载器最合适的选择,因为当我们接受all
策略时,url
选项似乎是可行的。
误解#
假设有这样一个功能,我们的数据根据缩放级别进行划分,当缩放级别改变时,我们必须重新请求当前缩放级别的数据。
...
loader:function(extent,resolution,projection){
console.log("在分辨率",resolution,"下加载数据");
getData(resoluton).then(response=>{
let features = source.getFormat().readFeatures(response);
source.clear();
source.addFeatures(features);
})
}
...
示例代码中,我们期望在视图的缩放级别更改时触发加载器,清除先前的要素并在新的缩放级别上加载新的要素。但是当滚动滚轮时,情况并非如此。
日志消息显示loader
只在最开始的几次触发,当我们不断增加缩放级别(分辨率)时,loader
不再触发。
但是为什么呢?
范围是loader
的主要控制器,当调用loader(extent...)
时,范围将添加到源的加载范围中(代码在 Vector.js 中),因此,如果分辨率改变但新的范围在已加载的范围内,loader
将不会被触发。
现在清楚了,在最开始的几次中,范围包含在内,所以当我们不断增加缩放级别时,除非范围超过已加载的范围,否则矢量源不会调用其加载器。