Mercurial > gemma
annotate client/src/components/map/Map.vue @ 3077:db890b71f070
client: panes: added paneId to mixin
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Thu, 18 Apr 2019 08:41:43 +0200 |
parents | 0233845cadb7 |
children | 57255fda7594 |
rev | line source |
---|---|
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
1 <template> |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
2 <div |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
3 :id="'map-' + uuid" |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
4 :class="[ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
5 'map', |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
6 { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
7 splitscreen: this.splitscreen, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
8 nocursor: this.hasActiveInteractions |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
9 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
10 ]" |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
11 ></div> |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
12 </template> |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
13 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
14 <style lang="sass" scoped> |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
15 .map |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
16 width: 100% |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
17 height: 100% |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
18 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
19 &.splitscreen |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
20 height: 50% |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
21 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
22 &.nocursor |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
23 cursor: none |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
24 </style> |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
25 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
26 <script> |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
27 /* This is Free Software under GNU Affero General Public License v >= 3.0 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
28 * without warranty, see README.md and license for details. |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
29 * |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
30 * SPDX-License-Identifier: AGPL-3.0-or-later |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
31 * License-Filename: LICENSES/AGPL-3.0.txt |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
32 * |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
33 * Copyright (C) 2018, 2019 by via donau |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
34 * – Österreichische Wasserstraßen-Gesellschaft mbH |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
35 * Software engineering by Intevation GmbH |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
36 * |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
37 * Author(s): |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
38 * * Thomas Junk <thomas.junk@intevation.de> |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
39 * * Bernhard E. Reiter <bernhard.reiter@intevation.de> |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
40 */ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
41 import { HTTP } from "@/lib/http"; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
42 import { mapState } from "vuex"; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
43 import { Map, View } from "ol"; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
44 import { Stroke, Style, Fill } from "ol/style"; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
45 import { displayError } from "@/lib/errors"; |
3077
db890b71f070
client: panes: added paneId to mixin
Markus Kottlaender <markus@intevation.de>
parents:
3072
diff
changeset
|
46 import { uuid, pane } from "@/lib/mixins"; |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
47 import layers from "@/components/map/layers"; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
48 import "ol/ol.css"; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
49 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
50 /* for the sake of debugging */ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
51 /* eslint-disable no-console */ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
52 export default { |
3077
db890b71f070
client: panes: added paneId to mixin
Markus Kottlaender <markus@intevation.de>
parents:
3072
diff
changeset
|
53 mixins: [uuid, pane], |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
54 data() { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
55 return { |
3016
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
56 map: null, |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
57 splitscreen: false |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
58 }; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
59 }, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
60 computed: { |
3063
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
61 ...mapState("map", ["initialLoad", "extent", "syncedView"]), |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
62 ...mapState("bottlenecks", ["selectedSurvey"]), |
3057
40a4a808b9b6
client: map: fixed watcher
Markus Kottlaender <markus@intevation.de>
parents:
3052
diff
changeset
|
63 ...mapState("application", ["showSplitscreen", "panes", "paneRotate"]), |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
64 ...mapState("imports", ["selectedStretchId"]), |
3021
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
65 layers() { |
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
66 return layers(); |
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
67 }, |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
68 hasActiveInteractions() { |
3062
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
69 let active = false; |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
70 if (this.map) { |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
71 this.map |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
72 .getInteractions() |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
73 .getArray() |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
74 .filter(i => |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
75 ["linetool", "polygontool", "cuttool"].includes(i.get("id")) |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
76 ) |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
77 .forEach(i => { |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
78 if (i.getActive()) { |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
79 active = true; |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
80 } |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
81 }); |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
82 } |
87e0422cffa7
client: draw/cut tools work now with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3057
diff
changeset
|
83 return active; |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
84 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
85 }, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
86 methods: { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
87 updateBottleneckFilter(bottleneck_id, datestr) { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
88 const exists = bottleneck_id != "does_not_exist"; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
89 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
90 if (exists) { |
3021
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
91 this.layers |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
92 .get("BOTTLENECKISOLINE") |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
93 .getSource() |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
94 .updateParams({ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
95 cql_filter: `date_info='${datestr}' AND bottleneck_id='${bottleneck_id}'` |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
96 }); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
97 } |
3021
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
98 this.layers.get("BOTTLENECKISOLINE").setVisible(exists); |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
99 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
100 }, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
101 watch: { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
102 showSplitscreen(show) { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
103 if (show) { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
104 setTimeout(() => { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
105 this.splitscreen = true; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
106 }, 350); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
107 } else { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
108 this.splitscreen = false; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
109 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
110 }, |
3016
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
111 panes() { |
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
112 this.$nextTick(() => this.map.updateSize()); |
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
113 }, |
3057
40a4a808b9b6
client: map: fixed watcher
Markus Kottlaender <markus@intevation.de>
parents:
3052
diff
changeset
|
114 paneRotate() { |
3016
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
115 this.$nextTick(() => this.map.updateSize()); |
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
116 }, |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
117 splitscreen() { |
3016
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
118 this.$nextTick(() => this.map.updateSize()); |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
119 }, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
120 selectedSurvey(newSelectedSurvey) { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
121 if (newSelectedSurvey) { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
122 this.updateBottleneckFilter( |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
123 newSelectedSurvey.bottleneck_id, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
124 newSelectedSurvey.date_info |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
125 ); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
126 } else { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
127 this.updateBottleneckFilter("does_not_exist", "1999-10-01"); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
128 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
129 }, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
130 selectedStretchId(id) { |
3021
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
131 this.layers |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
132 .get("STRETCHES") |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
133 .getSource() |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
134 .getFeatures() |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
135 .forEach(f => { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
136 f.set("highlighted", false); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
137 if (id === f.getId()) { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
138 f.set("highlighted", true); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
139 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
140 }); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
141 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
142 }, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
143 mounted() { |
3063
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
144 if (!this.syncedView) { |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
145 this.$store.commit( |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
146 "map/syncedView", |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
147 new View({ |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
148 center: [this.extent.lon, this.extent.lat], |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
149 minZoom: 5, // restrict zooming out to ~size of Europe for width 1000px |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
150 zoom: this.extent.zoom, |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
151 projection: "EPSG:3857" |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
152 }) |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
153 ); |
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
154 } |
3016
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
155 this.map = new Map({ |
3021
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
156 layers: this.layers.config, |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
157 target: "map-" + this.uuid, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
158 controls: [], |
3063
333aff79197d
client: maps: all map's views are now synced
Markus Kottlaender <markus@intevation.de>
parents:
3062
diff
changeset
|
159 view: this.syncedView |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
160 }); |
3021
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
161 this.map.getLayer = id => this.layers.get(id); |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
162 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
163 // store map position on every move |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
164 // will be obsolete once we abandoned the separated admin context |
3016
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
165 this.map.on("moveend", event => { |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
166 const center = event.map.getView().getCenter(); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
167 this.$store.commit("map/extent", { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
168 lat: center[1], |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
169 lon: center[0], |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
170 zoom: event.map.getView().getZoom() |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
171 }); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
172 }); |
3016
083cd270bdfd
client: splitview: implemented rotation mechanism
Markus Kottlaender <markus@intevation.de>
parents:
3011
diff
changeset
|
173 this.$store.dispatch("map/openLayersMap", this.map); |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
174 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
175 // move to user specific default extent if map loads for the first timeout |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
176 // checking initialLoad will be obsolete once we abandoned the separated admin context |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
177 if (this.initialLoad) { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
178 this.$store.commit("map/initialLoad", false); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
179 var currentUser = this.$store.state.user.user; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
180 HTTP.get("/users/" + currentUser, { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
181 headers: { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
182 "X-Gemma-Auth": localStorage.getItem("token"), |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
183 "Content-type": "text/xml; charset=UTF-8" |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
184 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
185 }) |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
186 .then(response => { |
3044
c71373594719
client: map: prepared store to hold multiple map objects
Markus Kottlaender <markus@intevation.de>
parents:
3021
diff
changeset
|
187 this.$store.dispatch("map/moveToBoundingBox", { |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
188 boundingBox: [ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
189 response.data.extent.x1, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
190 response.data.extent.y1, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
191 response.data.extent.x2, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
192 response.data.extent.y2 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
193 ], |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
194 zoom: 17, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
195 preventZoomOut: true |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
196 }); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
197 }) |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
198 .catch(error => { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
199 const { status, data } = error.response; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
200 displayError({ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
201 title: this.$gettext("Backend Error"), |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
202 message: `${status}: ${data.message || data}` |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
203 }); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
204 }); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
205 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
206 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
207 // load configured bottleneck colors |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
208 HTTP.get("/system/style/Bottlenecks/stroke", { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
209 headers: { "X-Gemma-Auth": localStorage.getItem("token") } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
210 }) |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
211 .then(response => { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
212 let btlnStrokeC = response.data.code; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
213 HTTP.get("/system/style/Bottlenecks/fill", { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
214 headers: { "X-Gemma-Auth": localStorage.getItem("token") } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
215 }) |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
216 .then(response => { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
217 let btlnFillC = response.data.code; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
218 var newStyle = new Style({ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
219 stroke: new Stroke({ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
220 color: btlnStrokeC, |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
221 width: 4 |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
222 }), |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
223 fill: new Fill({ |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
224 color: btlnFillC |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
225 }) |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
226 }); |
3021
2e2a271c1026
client: fixed layer factory to actually serve different objects
Markus Kottlaender <markus@intevation.de>
parents:
3016
diff
changeset
|
227 this.layers.get("BOTTLENECKS").setStyle(newStyle); |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
228 }) |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
229 .catch(error => { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
230 console.log(error); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
231 }); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
232 }) |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
233 .catch(error => { |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
234 console.log(error); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
235 }); |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
236 |
3051
051a3f446ac2
client: made identify tool work with multiple maps
Markus Kottlaender <markus@intevation.de>
parents:
3044
diff
changeset
|
237 this.$store.dispatch("map/initIdentifyTool", this.map); |
3052
01210542e028
client: remove openlayers map objects after removing a map component from the view
Markus Kottlaender <markus@intevation.de>
parents:
3051
diff
changeset
|
238 }, |
01210542e028
client: remove openlayers map objects after removing a map component from the view
Markus Kottlaender <markus@intevation.de>
parents:
3051
diff
changeset
|
239 destroyed() { |
01210542e028
client: remove openlayers map objects after removing a map component from the view
Markus Kottlaender <markus@intevation.de>
parents:
3051
diff
changeset
|
240 this.$store.commit("map/removeOpenLayersMap", this.map); |
3011
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
241 } |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
242 }; |
fc8fbea24568
client: moved map component, layer factory and styles to own subdirectory
Markus Kottlaender <markus@intevation.de>
parents:
diff
changeset
|
243 </script> |