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 將不會觸發。
現在清楚了,最初幾次的範圍包含在內,所以當我們不斷增加縮放級別時,除非範圍超出已加載範圍,否則向量源不會調用其加載器。

載入中......
此文章數據所有權由區塊鏈加密技術和智能合約保障僅歸創作者所有。