Mercurial > gemma
comparison client/src/components/toolbar/Polygontool.vue @ 3062:87e0422cffa7
client: draw/cut tools work now with multiple maps
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Tue, 16 Apr 2019 12:49:29 +0200 |
parents | c71373594719 |
children |
comparison
equal
deleted
inserted
replaced
3061:563176194d74 | 3062:87e0422cffa7 |
---|---|
1 <template> | 1 <template> |
2 <div | 2 <div @click="toggle" class="toolbar-button" v-tooltip.right="label"> |
3 @click="togglePolygonTool" | |
4 class="toolbar-button" | |
5 v-tooltip.right="label" | |
6 > | |
7 <font-awesome-icon | 3 <font-awesome-icon |
8 icon="draw-polygon" | 4 icon="draw-polygon" |
9 :class="{ 'text-info': polygonTool && polygonTool.getActive() }" | 5 :class="{ 'text-info': polygonToolEnabled }" |
10 /> | 6 /> |
11 </div> | 7 </div> |
12 </template> | 8 </template> |
13 | 9 |
14 <script> | 10 <script> |
23 * Software engineering by Intevation GmbH | 19 * Software engineering by Intevation GmbH |
24 * | 20 * |
25 * Author(s): | 21 * Author(s): |
26 * Markus Kottländer <markus.kottlaender@intevation.de> | 22 * Markus Kottländer <markus.kottlaender@intevation.de> |
27 */ | 23 */ |
28 import { mapState, mapGetters } from "vuex"; | 24 import { mapState } from "vuex"; |
29 | 25 |
30 export default { | 26 export default { |
31 name: "polygontool", | 27 name: "polygontool", |
32 computed: { | 28 computed: { |
33 ...mapState("map", ["lineTool", "polygonTool", "cutTool"]), | 29 ...mapState("map", ["openLayersMaps", "polygonToolEnabled"]), |
34 ...mapGetters("map", ["openLayersMap"]), | |
35 label() { | 30 label() { |
36 return this.$gettext("Measure Area"); | 31 return this.$gettext("Measure Area"); |
37 } | 32 } |
38 }, | 33 }, |
39 methods: { | 34 methods: { |
40 togglePolygonTool() { | 35 toggle() { |
41 this.polygonTool.setActive(!this.polygonTool.getActive()); | 36 this.$store.commit("map/polygonToolEnabled", !this.polygonToolEnabled); |
42 this.lineTool.setActive(false); | 37 this.$store.commit("map/lineToolEnabled", false); |
43 this.cutTool.setActive(false); | 38 this.$store.commit("map/cutToolEnabled", false); |
44 this.$store.commit("map/setCurrentMeasurement", null); | 39 this.$store.commit("map/setCurrentMeasurement", null); |
45 this.openLayersMap | 40 this.openLayersMaps.forEach(m => { |
46 .getLayer("DRAWTOOL") | 41 m.getLayer("DRAWTOOL") |
47 .getSource() | 42 .getSource() |
48 .clear(); | 43 .clear(); |
44 }); | |
49 } | 45 } |
50 } | 46 } |
51 }; | 47 }; |
52 </script> | 48 </script> |