OpenLayers圖形附加資料與回撥
阿新 • • 發佈:2018-12-14
OpenLayers的feature有個feature.values_.data屬性,可以為其附加各種自定義資料。
當建立一個feature時:
var myData = { value0: '文字', leftClickCallback: function(params) {}, leftClickCallbackParams: {value: 1}, rightClickCallback: function(params) {}, rightClickCallbackParams: {value: 2} }; var feature = new ol.Feature({ geometry: new ol.geom.Point([0,0]), data: myData });
這樣就為建立的點feature附加了自定義的資料。
當獲取到該點feature時,通過其feature.values_.data屬性即可拿到自定義的資料。
若需要點選回撥或者執行自定義操作,那麼將所要執行的函式和引數從該data中取出,然後將引數傳給函式呼叫即可。
// 左鍵點選互動 map.on("click", function(event) { var pixel = map.getEventPixel(event.originalEvent); map.forEachFeatureAtPixel(pixel, function(feature, layer) { if(feature) { var data = feature.values_.data; if(data && data.leftClickCallback) { event.clickPoint = self.map.getEventCoordinate(event); data.leftClickCallback(event, feature, data.leftClickCallbackParams); } } }); }); // 右鍵點選互動 $(map.getViewport()).on("contextmenu", function(event) { event.preventDefault(); //遮蔽自帶的右鍵事件 var pixel = [event.offsetX, event.offsetY]; var feature = map.forEachFeatureAtPixel(pixel, function(feature) { return feature; }); if(feature) { var data = feature.values_.data; if(data && data.rightClickCallback) { event.clickPoint = map.getEventCoordinate(event); data.rightClickCallback(event, feature, data.rightClickCallbackParams); } } });