我試圖改變VectorTile圖層中一個特徵的樣式,一旦它被選中。然而在第一次選擇交互觸發控制檯報告一個錯誤:ol.interaction.Select在ol.source.VectorTile上給出了一個錯誤
Uncaught TypeError: feature.getId is not a function
at ol.source.Vector.addToIndex_ (ol-debug.js:66819)
at ol.source.Vector.addFeatureInternal (ol-debug.js:66772)
at ol.source.Vector.addFeature (ol-debug.js:66759)
at ol.source.Vector.<anonymous> (ol-debug.js:66919)
at ol.Collection.boundListener (ol-debug.js:3441)
at ol.Collection.ol.events.EventTarget.dispatchEvent (ol-debug.js:3859)
at ol.Collection.insertAt (ol-debug.js:12466)
at ol.Collection.push (ol-debug.js:12490)
at ol.Collection.extend (ol-debug.js:12402)
at ol.interaction.Select.handleEvent (ol-debug.js:70163)
我的工作我的方式,通過代碼,實現了罪魁禍首可能是,select
事件下的功能是不是ol.Feature而是ol.render.Feature。後者沒有getId()函數。但是在第一次之後,modifyingCollection
被設置爲true並且選擇功能起作用,但是新的選擇樣式從未被設置。
是否有不同的方式從ol.source.VectorTile中選擇不會產生此錯誤的功能?
相關代碼:
var select = new ol.interaction.Select({
condition: ol.events.condition.click,
multi: false,
style: new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(200,255,255,0.5)'
})
})
});
map.addInteraction(select);
select.on('select', function(e) {
var features = e.target.getFeatures();
features.forEach(function(feature) {
var props = feature.getProperties();
console.log(props)
})
});
var bagpanden = new ol.layer.VectorTile({
source: new ol.source.VectorTile({
attributions: 'BAG data: © <a href="https://www.kadaster.nl/bag">Kadaster</a> ' +
'Client: <a href="https://research.geodan.nl/">' +
'Geodan Research</a>',
format: new ol.format.MVT(),
tileGrid: ol.tilegrid.createXYZ({maxZoom: 22}),
tilePixelRatio: 1.000000001,
url: 'http://research.geodan.nl/service/geoserver/gwc/service/tms/1.0.0/research%[email protected][email protected]/' +
'{z}/{x}/{-y}.pbf'
}),
style: createStyle()
});