banner
陈不易

陈不易

没有技术想聊生活
twitter
medium
tg_channel

使用OpenLayers矢量源加载器

矢量源的url选项是加载矢量数据的首选,但当需要特殊的后处理或加载策略时,它无法工作。

https://openlayers.org/en/latest/apidoc/module-ol_source_Vector-VectorSource.html

加载策略#

首先,我们应该了解 openlayers 中的加载策略。openlayers 中有 3 种标准的加载策略。

  • all:在一个请求中加载所有要素。
  • bbox:根据当前视图的范围和分辨率加载要素。
  • tile:基于瓦片网格加载要素,与allbbox的区别在于它接受一个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将不会被触发。
现在清楚了,在最开始的几次中,范围包含在内,所以当我们不断增加缩放级别时,除非范围超过已加载的范围,否则矢量源不会调用其加载器。

加载中...
此文章数据所有权由区块链加密技术和智能合约保障仅归创作者所有。