Mercurial > gemma
changeset 1435:7fa030127b05
fixed panning problem
Drawend was triggered before click event, causing the cutTool to be always already disabled
when the identify tool was triggered.
| author | Markus Kottlaender <markus@intevation.de> |
|---|---|
| date | Fri, 30 Nov 2018 08:26:13 +0100 |
| parents | 5b8ab039a983 |
| children | 59c9dbb26bb0 c89a18f8027d |
| files | client/src/components/map/Maplayer.vue client/src/components/map/fairway/Profiles.vue client/src/components/map/toolbar/Toolbar.vue client/src/store/fairway.js client/src/store/map.js |
| diffstat | 5 files changed, 84 insertions(+), 64 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/map/Maplayer.vue Fri Nov 30 07:10:13 2018 +0100 +++ b/client/src/components/map/Maplayer.vue Fri Nov 30 08:26:13 2018 +0100 @@ -43,7 +43,6 @@ import { Map, View } from "ol"; import { WFS, GeoJSON } from "ol/format.js"; import { Stroke, Style, Fill } from "ol/style.js"; -import { getCenter } from "ol/extent"; /* for the sake of debugging */ /* eslint-disable no-console */ @@ -82,66 +81,6 @@ } }, methods: { - identify(coordinate, pixel) { - if (!this.hasActiveInteractions) { - this.$store.commit("map/setIdentifiedFeatures", []); - // checking our WFS layers - var features = this.openLayersMap.getFeaturesAtPixel(pixel); - if (features) { - this.$store.commit("map/setIdentifiedFeatures", features); - - // get selected bottleneck from identified features - for (let feature of features) { - let id = feature.getId(); - // RegExp.prototype.test() works with number, str and undefined - if (/^bottlenecks\./.test(id)) { - this.$store.dispatch( - "bottlenecks/setSelectedBottleneck", - feature.get("objnam") - ); - this.$store.commit("map/moveMap", { - coordinates: getCenter( - feature - .getGeometry() - .clone() - .transform("EPSG:3857", "EPSG:4326") - .getExtent() - ), - zoom: 17, - preventZoomOut: true - }); - } - } - } - - // DEBUG output and example how to remove the GeometryName - /* - for (let feature of features) { - console.log("Identified:", feature.getId()); - for (let key of feature.getKeys()) { - if (key != feature.getGeometryName()) { - console.log(key, feature.get(key)); - } - } - } - */ - - // trying the GetFeatureInfo way for WMS - var wmsSource = this.getVSourceByName("Inland ECDIS chart Danube"); - var url = wmsSource.getGetFeatureInfoUrl( - coordinate, - 100 /* resolution */, - "EPSG:3857", - // { INFO_FORMAT: "application/vnd.ogc.gml" } // not allowed by d4d - { INFO_FORMAT: "text/plain" } - ); - - if (url) { - // cannot directly query here because of SOP - console.log("GetFeatureInfo url:", url); - } - } - }, buildVectorLoader(featureRequestOptions, endpoint, vectorSource) { // build a function to be used for VectorSource.setLoader() // make use of WFS().writeGetFeature to build the request @@ -424,9 +363,7 @@ // so none is shown this.updateBottleneckFilter("does_not_exist", "1999-10-01"); - this.openLayersMap.on(["singleclick", "dblclick"], event => { - this.identify(event.coordinate, event.pixel); - }); + this.$store.dispatch("map/enableIdentifyTool"); this.$store.dispatch("bottlenecks/loadBottlenecks"); } };
--- a/client/src/components/map/fairway/Profiles.vue Fri Nov 30 07:10:13 2018 +0100 +++ b/client/src/components/map/fairway/Profiles.vue Fri Nov 30 08:26:13 2018 +0100 @@ -332,6 +332,13 @@ this.lineTool.setActive(false); this.polygonTool.setActive(false); this.$store.commit("map/setCurrentMeasurement", null); + + // toggle identifyTool (map events singleclick and dblclick) + this.$store.dispatch( + this.cutTool.getActive() + ? "map/disableIdentifyTool" + : "map/enableIdentifyTool" + ); } }, onCopyCoordinates() {
--- a/client/src/components/map/toolbar/Toolbar.vue Fri Nov 30 07:10:13 2018 +0100 +++ b/client/src/components/map/toolbar/Toolbar.vue Fri Nov 30 08:26:13 2018 +0100 @@ -107,6 +107,7 @@ this.polygonTool.setActive(false); this.cutTool.setActive(false); this.$store.commit("map/setCurrentMeasurement", null); + this.$store.dispatch("map/enableIdentifyTool"); this.getVSourceByName("Draw Tool").clear(); } });
--- a/client/src/store/fairway.js Fri Nov 30 07:10:13 2018 +0100 +++ b/client/src/store/fairway.js Fri Nov 30 08:26:13 2018 +0100 @@ -118,6 +118,7 @@ actions: { clearSelection({ commit, dispatch, rootGetters, rootState }) { dispatch("bottlenecks/setSelectedBottleneck", null, { root: true }); + dispatch("map/enableIdentifyTool", null, { root: true }); commit("clearCurrentProfile"); commit("application/showSplitscreen", false, { root: true }); rootState.map.cutTool.setActive(false); @@ -188,6 +189,7 @@ commit("profileLoading", true); Promise.all(profileLoaders) .then(() => { + dispatch("map/enableIdentifyTool", null, { root: true }); rootState.map.cutTool.setActive(false); rootGetters["map/getVSourceByName"]( "Fairway Dimensions"
--- a/client/src/store/map.js Fri Nov 30 07:10:13 2018 +0100 +++ b/client/src/store/map.js Fri Nov 30 08:26:13 2018 +0100 @@ -26,6 +26,8 @@ import { HTTP } from "../lib/http"; import { fromLonLat } from "ol/proj"; import { getLength, getArea } from "ol/sphere.js"; +import { unByKey } from "ol/Observable"; +import { getCenter } from "ol/extent"; // initial state const init = () => { @@ -36,6 +38,7 @@ lon: 1819178, zoom: 11 }, + identifyTool: null, // event binding (singleclick, dblclick) identifiedFeatures: [], // map features identified by clicking on the map currentMeasurement: null, // distance or area from line-/polygon-/cutTool lineTool: null, // open layers interaction object (Draw) @@ -362,6 +365,9 @@ openLayersMap: (state, map) => { state.openLayersMap = map; }, + identifyTool: (state, events) => { + state.identifyTool = events; + }, setIdentifiedFeatures: (state, identifiedFeatures) => { state.identifiedFeatures = identifiedFeatures; }, @@ -471,6 +477,73 @@ commit("polygonTool", polygonTool); commit("cutTool", cutTool); commit("openLayersMap", map); + }, + disableIdentifyTool({ state }) { + unByKey(state.identifyTool); + }, + enableIdentifyTool({ state, commit, dispatch, getters }) { + state.identifyTool = state.openLayersMap.on( + ["singleclick", "dblclick"], + event => { + commit("setIdentifiedFeatures", []); + // checking our WFS layers + var features = state.openLayersMap.getFeaturesAtPixel(event.pixel); + if (features) { + commit("setIdentifiedFeatures", features); + + // get selected bottleneck from identified features + for (let feature of features) { + let id = feature.getId(); + // RegExp.prototype.test() works with number, str and undefined + if (/^bottlenecks\./.test(id)) { + dispatch( + "bottlenecks/setSelectedBottleneck", + feature.get("objnam"), + { root: true } + ); + commit("moveMap", { + coordinates: getCenter( + feature + .getGeometry() + .clone() + .transform("EPSG:3857", "EPSG:4326") + .getExtent() + ), + zoom: 17, + preventZoomOut: true + }); + } + } + } + + // DEBUG output and example how to remove the GeometryName + /* + for (let feature of features) { + console.log("Identified:", feature.getId()); + for (let key of feature.getKeys()) { + if (key != feature.getGeometryName()) { + console.log(key, feature.get(key)); + } + } + } + */ + + // trying the GetFeatureInfo way for WMS + var wmsSource = getters.getVSourceByName("Inland ECDIS chart Danube"); + var url = wmsSource.getGetFeatureInfoUrl( + event.coordinate, + 100 /* resolution */, + "EPSG:3857", + // { INFO_FORMAT: "application/vnd.ogc.gml" } // not allowed by d4d + { INFO_FORMAT: "text/plain" } + ); + + if (url) { + // cannot directly query here because of SOP + console.log("GetFeatureInfo url:", url); + } + } + ); } } };