Mercurial > gemma

annotate client/src/map/Maplayer.vue @ 829:797063af6dc8

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
client: complete simple survey selection * Change code to only request a profile if a selectedMorph is there and use the selected date and bottleneck id for the backend request.
author Bernhard Reiter <bernhard@intevation.de>
date Thu, 27 Sep 2018 23:45:58 +0200
parents 68a39aea942a
children d9da1ea14abf
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
1 <template>
621
b17a4482d07d feat: UI adaptation of 4 slots
Thomas Junk <thomas.junk@intevation.de>
parents: 620
diff changeset
2 <div id="map" :class="mapStyle"></div>
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
3 </template>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
4
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
5 <style lang="scss">
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
6 .mapsplit {
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
7 height: 50vh;
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
8 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
9
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
10 .mapfull {
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
11 height: 100vh;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
12 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
13 </style>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
14
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
15 <script>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
16 import { HTTP } from "../application/lib/http";
783
ab9604a46075 client: add move after clicking search result
Bernhard Reiter <bernhard@intevation.de>
parents: 782
diff changeset
17 import { mapGetters, mapState } from "vuex";
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
18 import "ol/ol.css";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
19 import { Map, View } from "ol";
709
35fd15711e9e client: prepare to send profile cut to backend
Bernhard Reiter <bernhard@intevation.de>
parents: 706
diff changeset
20 import Feature from "ol/Feature";
715
23b68cd4bed3 client: re-enable loading of full river bank marks
Bernhard Reiter <bernhard@intevation.de>
parents: 714
diff changeset
21 // import { bbox as bboxFilter } from "ol/format/filter.js";
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
22 import { WFS, GeoJSON } from "ol/format.js";
754
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
23 // import GeometryType from "ol/geom/GeometryType.js";
709
35fd15711e9e client: prepare to send profile cut to backend
Bernhard Reiter <bernhard@intevation.de>
parents: 706
diff changeset
24 import LineString from "ol/geom/LineString.js";
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
25 import Draw from "ol/interaction/Draw.js";
709
35fd15711e9e client: prepare to send profile cut to backend
Bernhard Reiter <bernhard@intevation.de>
parents: 706
diff changeset
26 import { Vector as VectorLayer } from "ol/layer.js";
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
27 import { Vector as VectorSource } from "ol/source.js";
793
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
28 import { getLength } from "ol/sphere.js";
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
29
738
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
30 import distance from "@turf/distance";
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
31 import {
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
32 lineString as turfLineString,
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
33 polygon as turfPolygon
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
34 } from "@turf/helpers";
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
35 //import { lineIntersect as turfLineIntersect } from "@turf/line-intersect";
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
36 import lineIntersect from "@turf/line-intersect";
767
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
37 import { displayError } from "../application/lib/errors.js";
738
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
38
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
39 const DEMODATA = 2.5;
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
40
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
41 export default {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
42 name: "maplayer",
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
43 props: ["drawMode", "lat", "long", "zoom", "split"],
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
44 data() {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
45 return {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
46 projection: "EPSG:3857",
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
47 interaction: null,
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
48 vectorLayer: null,
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
49 vectorSource: null
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
50 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
51 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
52 computed: {
783
ab9604a46075 client: add move after clicking search result
Bernhard Reiter <bernhard@intevation.de>
parents: 782
diff changeset
53 ...mapGetters("mapstore", ["layers", "getLayerByName"]),
829
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
54 ...mapState("mapstore", ["openLayersMap", "selectedMorph"]),
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
55 mapStyle() {
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
56 return {
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
57 mapfull: !this.split,
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
58 mapsplit: this.split
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
59 };
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
60 },
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
61 layerData() {
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
62 const l = this.layers.map(x => {
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
63 return x.data;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
64 });
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
65 return [...l, this.vectorLayer];
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
66 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
67 },
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
68 methods: {
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
69 createVectorSource() {
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
70 this.vectorSource = new VectorSource({ wrapX: false });
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
71 },
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
72 createVectorLayer() {
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
73 this.vectorLayer = new VectorLayer({
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
74 source: this.vectorSource
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
75 });
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
76 },
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
77 removeCurrentInteraction() {
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
78 this.openLayersMap.removeInteraction(this.interaction);
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
79 this.interaction = null;
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
80 },
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
81 createInteraction() {
752
f09cbe80a864 refac: small improvements
Thomas Junk <thomas.junk@intevation.de>
parents: 745
diff changeset
82 this.vectorSource.clear();
705
6aa09d12157f client: add detection of drawend
Bernhard Reiter <bernhard@intevation.de>
parents: 703
diff changeset
83 var draw = new Draw({
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
84 source: this.vectorSource,
752
f09cbe80a864 refac: small improvements
Thomas Junk <thomas.junk@intevation.de>
parents: 745
diff changeset
85 type: this.drawMode,
f09cbe80a864 refac: small improvements
Thomas Junk <thomas.junk@intevation.de>
parents: 745
diff changeset
86 maxPoints: 2
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
87 });
793
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
88 draw.on("drawstart", event => {
752
f09cbe80a864 refac: small improvements
Thomas Junk <thomas.junk@intevation.de>
parents: 745
diff changeset
89 this.vectorSource.clear();
793
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
90 this.$store.commit("mapstore/setCurrentMeasurement", null);
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
91 event.feature.setId("drawn.1"); // unique id for new feature
706
d47fa556a3e8 client: improve draw behaviour
Bernhard Reiter <bernhard@intevation.de>
parents: 705
diff changeset
92 });
705
6aa09d12157f client: add detection of drawend
Bernhard Reiter <bernhard@intevation.de>
parents: 703
diff changeset
93 draw.on("drawend", this.drawEnd);
6aa09d12157f client: add detection of drawend
Bernhard Reiter <bernhard@intevation.de>
parents: 703
diff changeset
94 return draw;
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
95 },
706
d47fa556a3e8 client: improve draw behaviour
Bernhard Reiter <bernhard@intevation.de>
parents: 705
diff changeset
96 drawEnd(event) {
793
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
97 const length = getLength(event.feature.getGeometry());
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
98 this.$store.commit("mapstore/setCurrentMeasurement", length);
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
99 // also place the a rounded length in a property, so identify can show it
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
100 event.feature.set("length", Math.round(length * 10) / 10);
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
101
829
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
102 // if a survey has been selected, request a profile
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
103 // TODO an improvement could be to check if the line intersects
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
104 // with the bottleneck area's polygon before trying the server request
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
105 if (this.selectedMorph) {
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
106 console.log("requesting profile for", this.selectedMorph);
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
107 this.requestProfile(event, this.selectedMorph);
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
108 }
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
109 },
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
110 requestProfile(event, survey) {
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
111 // survey has to have the properties bottleneck_id and date_info
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
112
793
073394629ec6 client: add measurement and improve identify
Bernhard Reiter <bernhard@intevation.de>
parents: 790
diff changeset
113 // prepare to send the first line seqment to the server as GeoJSON
754
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
114 const inputLineString = event.feature.getGeometry().clone();
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
115 inputLineString.transform("EPSG:3857", "EPSG:4326");
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
116 const [start, end] = inputLineString.getCoordinates();
767
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
117 this.$store.commit("fairwayprofile/setStartPoint", start);
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
118 this.$store.commit("fairwayprofile/setEndPoint", end);
754
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
119 const profileLine = new LineString([start, end]);
829
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
120 const feature = new Feature({
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
121 geometry: profileLine,
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
122 bottleneck: survey.bottleneck_id,
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
123 dat: survey.date_info
797063af6dc8 client: complete simple survey selection
Bernhard Reiter <bernhard@intevation.de>
parents: 810
diff changeset
124 });
754
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
125 const geoJSON = new GeoJSON({ geometryName: "geometry" }).writeFeature(
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
126 feature
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
127 );
767
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
128 this.$store
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
129 .dispatch("fairwayprofile/loadProfile", geoJSON)
797
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
130 .then(() => {
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
131 var vectorSource = this.getLayerByName(
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
132 "Fairway Dimensions"
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
133 ).data.getSource();
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
134 vectorSource.forEachFeatureIntersectingExtent(
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
135 // need to use EPSG:3857 which is the proj of vectorSource
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
136 profileLine
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
137 .clone()
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
138 .transform("EPSG:4326", "EPSG:3857")
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
139 .getExtent(),
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
140 feature => {
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
141 // transform back to prepare for usage
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
142 var intersectingPolygon = feature
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
143 .getGeometry()
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
144 .clone()
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
145 .transform("EPSG:3857", "EPSG:4326");
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
146 this.addToFairwayRectangle(
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
147 profileLine,
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
148 intersectingPolygon,
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
149 DEMODATA
797
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
150 );
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
151 }
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
152 );
810
68a39aea942a Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
153 this.$store.commit("application/openSplitScreen");
797
644172f201e8 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 793
diff changeset
154 })
767
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
155 .catch(error => {
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
156 const { status, data } = error.response;
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
157 displayError({
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
158 title: "Backend Error",
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
159 message: `${status}: ${data.message || data}`
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
160 });
dedf252b3e01 feat: fairwayprofile partially with retrieved data from the server
Thomas Junk <thomas.junk@intevation.de>
parents: 765
diff changeset
161 });
706
d47fa556a3e8 client: improve draw behaviour
Bernhard Reiter <bernhard@intevation.de>
parents: 705
diff changeset
162 },
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
163 addToFairwayRectangle(profileLine, fairwayGeometry, depth) {
734
1581ba78a360 client: prepare for fairway intersection for profile
Bernhard Reiter <bernhard@intevation.de>
parents: 733
diff changeset
164 // both geometries have to be in EPSG:4326
738
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
165 // uses turfjs distance() function
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
166 let fairwayCoordinates = [];
738
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
167 var line = turfLineString(profileLine.getCoordinates());
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
168 var polygon = turfPolygon(fairwayGeometry.getCoordinates());
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
169 var intersects = lineIntersect(line, polygon);
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
170 var l = intersects.features.length;
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
171 if (l % 2 != 0) {
772
990a9d85ac6c client: readd diagnosis output for fairway rectangle calc
Bernhard Reiter <bernhard@intevation.de>
parents: 770
diff changeset
172 console.log("Ignoring fairway because profile only intersects once.");
738
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
173 } else {
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
174 for (let i = 0; i < l; i += 2) {
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
175 let pStartPoint = profileLine.getCoordinates()[0];
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
176 let fStartPoint = intersects.features[i].geometry.coordinates;
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
177 let fEndPoint = intersects.features[i + 1].geometry.coordinates;
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
178 let opts = { units: "kilometers" };
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
179
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
180 fairwayCoordinates.push([
738
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
181 distance(pStartPoint, fStartPoint, opts) * 1000,
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
182 distance(pStartPoint, fEndPoint, opts) * 1000,
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
183 depth
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
184 ]);
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
185 }
d7530644dde3 client: add calculation of fairway rectangles
Bernhard Reiter <bernhard@intevation.de>
parents: 734
diff changeset
186 }
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
187 this.$store.commit(
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
188 "fairwayprofile/setFairwayCoordinates",
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
189 fairwayCoordinates
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 797
diff changeset
190 );
734
1581ba78a360 client: prepare for fairway intersection for profile
Bernhard Reiter <bernhard@intevation.de>
parents: 733
diff changeset
191 },
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
192 activateInteraction() {
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
193 const interaction = this.createInteraction(this.drawMode);
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
194 this.interaction = interaction;
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
195 this.openLayersMap.addInteraction(interaction);
701
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
196 },
764
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
197 activateIdentifyMode() {
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
198 this.openLayersMap.on("singleclick", event => {
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
199 // console.log("single click on map:", event);
765
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
200 this.identify(event.coordinate, event.pixel);
764
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
201 });
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
202 },
765
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
203 identify(coordinate, pixel) {
770
c12ec7fde3f2 client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents: 767
diff changeset
204 this.$store.commit("mapstore/setIdentifiedFeatures", []);
765
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
205 // checking our WFS layers
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
206 var features = this.openLayersMap.getFeaturesAtPixel(pixel);
770
c12ec7fde3f2 client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents: 767
diff changeset
207 this.$store.commit("mapstore/setIdentifiedFeatures", features);
c12ec7fde3f2 client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents: 767
diff changeset
208
c12ec7fde3f2 client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents: 767
diff changeset
209 // DEBUG output and example how to remove the GeometryName
c12ec7fde3f2 client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents: 767
diff changeset
210 /*
765
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
211 for (let feature of features) {
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
212 console.log("Identified:", feature.getId());
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
213 for (let key of feature.getKeys()) {
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
214 if (key != feature.getGeometryName()) {
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
215 console.log(key, feature.get(key));
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
216 }
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
217 }
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
218 }
770
c12ec7fde3f2 client: add simple identify top area box
Bernhard Reiter <bernhard@intevation.de>
parents: 767
diff changeset
219 */
765
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
220
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
221 // trying the GetFeatureInfo way for WMS
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
222 var wmsSource = this.getLayerByName(
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
223 "Inland ECDIS chart Danube"
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
224 ).data.getSource();
764
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
225 var url = wmsSource.getGetFeatureInfoUrl(
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
226 coordinate,
765
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
227 100 /* resolution */,
764
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
228 "EPSG:3857",
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
229 // { INFO_FORMAT: "application/vnd.ogc.gml" } // not allowed by d4d
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
230 { INFO_FORMAT: "text/plain" }
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
231 );
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
232
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
233 if (url) {
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
234 // cannot directly query here because of SOP
765
c1baaff348b0 client: add code to identify WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 764
diff changeset
235 console.log("GetFeatureInfo url:", url);
764
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
236 }
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
237 },
701
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
238 buildVectorLoader(featureRequestOptions, endpoint, vectorSource) {
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
239 // build a function to be used for VectorSource.setLoader()
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
240 // make use of WFS().writeGetFeature to build the request
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
241 // and use our HTTP library to actually do it
703
e9c28c42c927 client: improve WFS loader
Bernhard Reiter <bernhard@intevation.de>
parents: 702
diff changeset
242 // NOTE: a) the geometryName has to be given in featureRequestOptions,
e9c28c42c927 client: improve WFS loader
Bernhard Reiter <bernhard@intevation.de>
parents: 702
diff changeset
243 // because we want to load depending on the bbox
e9c28c42c927 client: improve WFS loader
Bernhard Reiter <bernhard@intevation.de>
parents: 702
diff changeset
244 // b) the VectorSource has to have the option strategy: bbox
701
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
245 featureRequestOptions["outputFormat"] = "application/json";
702
aaf5dbfb9512 client: improve loading of WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 701
diff changeset
246 var loader = function(extent, resolution, projection) {
701
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
247 featureRequestOptions["bbox"] = extent;
702
aaf5dbfb9512 client: improve loading of WFS features
Bernhard Reiter <bernhard@intevation.de>
parents: 701
diff changeset
248 featureRequestOptions["srsName"] = projection.getCode();
701
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
249 var featureRequest = new WFS().writeGetFeature(featureRequestOptions);
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
250 // DEBUG console.log(featureRequest);
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
251 HTTP.post(
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
252 endpoint,
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
253 new XMLSerializer().serializeToString(featureRequest),
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
254 {
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
255 headers: {
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
256 "X-Gemma-Auth": localStorage.getItem("token"),
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
257 "Content-type": "text/xml; charset=UTF-8"
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
258 }
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
259 }
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
260 )
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
261 .then(response => {
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
262 var features = new GeoJSON().readFeatures(
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
263 JSON.stringify(response.data)
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
264 );
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
265 vectorSource.addFeatures(features);
754
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
266 // console.log(
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
267 // "loaded",
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
268 // features.length,
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
269 // featureRequestOptions.featureTypes,
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
270 // "features"
105c421f99b1 refac: small improvements to code structure
Thomas Junk <thomas.junk@intevation.de>
parents: 752
diff changeset
271 // );
701
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
272 // DEBUG console.log("loaded ", features, "for", vectorSource);
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
273 // eslint-disable-next-line
713
badbc0207418 feat: systeminformation feature added
Thomas Junk <thomas.junk@intevation.de>
parents: 709
diff changeset
274 })
badbc0207418 feat: systeminformation feature added
Thomas Junk <thomas.junk@intevation.de>
parents: 709
diff changeset
275 .catch(() => {
701
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
276 vectorSource.removeLoadedExtent(extent);
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
277 });
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
278 };
8149772c62d6 client: add bbox loading strategy to riverkilometre
Bernhard Reiter <bernhard@intevation.de>
parents: 690
diff changeset
279 return loader;
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
280 }
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
281 },
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
282 watch: {
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
283 drawMode() {
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
284 if (this.interaction) {
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
285 this.removeCurrentInteraction();
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
286 } else {
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
287 this.activateInteraction();
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
288 }
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
289 },
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
290 split() {
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
291 const map = this.openLayersMap;
594
6987b5c926b8 fix: leveraging vue.nexttick instead of timeout
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
292 this.$nextTick(() => {
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
293 map.updateSize();
594
6987b5c926b8 fix: leveraging vue.nexttick instead of timeout
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
294 });
593
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
295 }
c4a4dc612191 feat: Toggleable fairway profile
Thomas Junk <thomas.junk@intevation.de>
parents: 585
diff changeset
296 },
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
297 mounted() {
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
298 this.createVectorSource();
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
299 this.createVectorLayer();
783
ab9604a46075 client: add move after clicking search result
Bernhard Reiter <bernhard@intevation.de>
parents: 782
diff changeset
300 let map = new Map({
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
301 layers: this.layerData,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
302 target: "map",
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
303 controls: [],
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
304 view: new View({
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
305 center: [this.long, this.lat],
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
306 zoom: this.zoom,
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
307 projection: this.projection
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
308 })
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
309 });
783
ab9604a46075 client: add move after clicking search result
Bernhard Reiter <bernhard@intevation.de>
parents: 782
diff changeset
310 this.$store.commit("mapstore/setOpenLayersMap", map);
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
311
733
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
312 // TODO make display of layers more dynamic, e.g. from a list
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
313
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
314 // loading the full WFS layer, by not setting the loader function
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
315 // and without bboxStrategy
628
ef9c733cc6aa client: show more wfs layers
Bernhard Reiter <bernhard@intevation.de>
parents: 626
diff changeset
316 var featureRequest2 = new WFS().writeGetFeature({
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
317 srsName: "EPSG:3857",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
318 featureNS: "gemma",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
319 featurePrefix: "gemma",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
320 featureTypes: ["fairway_dimensions"],
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
321 outputFormat: "application/json"
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
322 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
323
733
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
324 // NOTE: loading the full fairway_dimensions makes sure
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
325 // that all are available for the intersection with the profile
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
326 HTTP.post(
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
327 "/internal/wfs",
628
ef9c733cc6aa client: show more wfs layers
Bernhard Reiter <bernhard@intevation.de>
parents: 626
diff changeset
328 new XMLSerializer().serializeToString(featureRequest2),
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
329 {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
330 headers: {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
331 "X-Gemma-Auth": localStorage.getItem("token"),
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
332 "Content-type": "text/xml; charset=UTF-8"
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
333 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
334 }
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
335 ).then(response => {
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
336 var features = new GeoJSON().readFeatures(JSON.stringify(response.data));
733
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
337 var vectorSrc = this.getLayerByName(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
338 "Fairway Dimensions"
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
339 ).data.getSource();
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
340 vectorSrc.addFeatures(features);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
341 // would scale to the extend of all resulting features
649
83081ba6c9c1 feat: Linetool added
Thomas Junk <thomas.junk@intevation.de>
parents: 630
diff changeset
342 // this.openLayersMap.getView().fit(vectorSrc.getExtent());
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
343 });
620
ef00684e021f client: add showing special buoys
Bernhard Reiter <bernhard@intevation.de>
parents: 594
diff changeset
344
733
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
345 // load following layers with bboxStrategy (using our request builder)
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
346 var layer = null;
620
ef00684e021f client: add showing special buoys
Bernhard Reiter <bernhard@intevation.de>
parents: 594
diff changeset
347
733
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
348 layer = this.getLayerByName("Waterway Area");
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
349 layer.data.getSource().setLoader(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
350 this.buildVectorLoader(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
351 {
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
352 featurePrefix: "ws-wamos",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
353 featureTypes: ["ienc_wtware"],
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
354 geometryName: "geom"
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
355 },
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
356 "/external/d4d",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
357 layer.data.getSource()
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
358 )
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
359 );
628
ef9c733cc6aa client: show more wfs layers
Bernhard Reiter <bernhard@intevation.de>
parents: 626
diff changeset
360
733
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
361 layer = this.getLayerByName("Waterway Axis");
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
362 layer.data.getSource().setLoader(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
363 this.buildVectorLoader(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
364 {
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
365 featurePrefix: "ws-wamos",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
366 featureTypes: ["ienc_wtwaxs"],
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
367 geometryName: "geom"
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
368 },
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
369 "/external/d4d",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
370 layer.data.getSource()
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
371 )
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
372 );
628
ef9c733cc6aa client: show more wfs layers
Bernhard Reiter <bernhard@intevation.de>
parents: 626
diff changeset
373
733
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
374 layer = this.getLayerByName("Distance marks");
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
375 layer.data.getSource().setLoader(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
376 this.buildVectorLoader(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
377 {
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
378 featurePrefix: "ws-wamos",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
379 featureTypes: ["ienc_dismar"],
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
380 geometryName: "geom" //,
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
381 /* restrict loading approximately to extend of danube in Austria */
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
382 // filter: bboxFilter("geom", [13.3, 48.0, 17.1, 48.6], "EPSG:4326")
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
383 },
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
384 "/external/d4d",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
385 layer.data.getSource()
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
386 )
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
387 );
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
388 layer.data.setVisible(layer.isVisible);
628
ef9c733cc6aa client: show more wfs layers
Bernhard Reiter <bernhard@intevation.de>
parents: 626
diff changeset
389
733
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
390 layer = this.getLayerByName("Distance marks, Axis");
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
391 layer.data.getSource().setLoader(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
392 this.buildVectorLoader(
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
393 {
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
394 featureNS: "gemma",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
395 featurePrefix: "gemma",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
396 featureTypes: ["distance_marks_geoserver"],
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
397 geometryName: "geom"
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
398 },
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
399 "/internal/wfs",
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
400 layer.data.getSource()
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
401 )
e57955c1996f client: improve code structure
Bernhard Reiter <bernhard@intevation.de>
parents: 716
diff changeset
402 );
745
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
403
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
404 layer = this.getLayerByName("Waterway Area, named");
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
405 layer.data.getSource().setLoader(
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
406 this.buildVectorLoader(
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
407 {
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
408 featureNS: "gemma",
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
409 featurePrefix: "gemma",
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
410 featureTypes: ["hydro_seaare"],
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
411 geometryName: "geom"
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
412 },
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
413 "/external/d4d",
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
414 layer.data.getSource()
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
415 )
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
416 );
f2691e0d4970 client: add wfs layer for named waterway areas.
Bernhard Reiter <bernhard@intevation.de>
parents: 738
diff changeset
417 layer.data.setVisible(layer.isVisible);
764
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
418
790
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
419 layer = this.getLayerByName("Bottlenecks");
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
420 layer.data.getSource().setLoader(
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
421 this.buildVectorLoader(
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
422 {
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
423 featureNS: "gemma",
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
424 featurePrefix: "gemma",
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
425 featureTypes: ["bottlenecks"],
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
426 geometryName: "area"
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
427 },
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
428 "/internal/wfs",
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
429 layer.data.getSource()
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
430 )
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
431 );
1b82ae5e637e client: add bottleneck layer with first styling
Bernhard Reiter <bernhard@intevation.de>
parents: 783
diff changeset
432
764
a6a8fe89eb84 client: add hooks for identify mode
Bernhard Reiter <bernhard@intevation.de>
parents: 754
diff changeset
433 this.activateIdentifyMode();
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
434 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
435 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
436 </script>