let clickSelect = new Select({
condition: click,
hitTolerance: 5,
});
clickSelect.layerName = ‘dangerRiver‘;
var _this = this;
clickSelect.on(‘select‘, function (e) {
if (e.selected.length > 0) {
let layerName = e.target.getLayer(e.selected[0]).layerName;
if (layerName == ‘evacuationroute‘) {
this.getFeatures().clear();
} else {
_this.mapComponent.showPopup(e.selected[0], layerName);
this.getFeatures().clear();
}
}
});
this.mapComponent.map.addInteraction(clickSelect);
let pointerMoveSelect = new Select({
condition: pointerMove,
hitTolerance: 5,
});
pointerMoveSelect.on(‘select‘, function (e) {
let features = e.target.getFeatures().array_;
if (features.length > 0) {
let layerName = e.target.getLayer(e.selected[0]).layerName;
if (layerName == ‘evacuationroute‘) {
this.getFeatures().clear();
} else {
_this.mapComponent.map.getTargetElement().style.cursor = ‘pointer‘;
}
//this.getFeatures().clear();
} else {
_this.mapComponent.map.getTargetElement().style.cursor = ‘auto‘;
}
});
this.mapComponent.map.addInteraction(pointerMoveSelect);
引入：
import { click, pointerMove } from ‘ol/events/condition.js‘;
import Select from ‘ol/interaction/Select‘;
import Point from ‘ol/geom/Point‘;
import Feature from ‘ol/Feature‘;
