comparison client/src/components/layers/Layerselect.vue @ 2343:33d2ef9f9e5d

client: use the name constants for Layer names
author Fadi Abbud <fadi.abbud@intevation.de>
date Wed, 20 Feb 2019 10:00:01 +0100
parents a08e0f532304
children a7e31594959d
comparison
equal deleted inserted replaced
2342:4e325dda6a2d 2343:33d2ef9f9e5d
16 class="pointer layername form-check-label" 16 class="pointer layername form-check-label"
17 @click="visibilityToggled" 17 @click="visibilityToggled"
18 >{{ layername }}</label 18 >{{ layername }}</label
19 > 19 >
20 </div> 20 </div>
21 <div v-if="isVisible && layername == 'Bottleneck isolines'"> 21 <div v-if="isVisible && isBottleneckIsolineLayer">
22 <img class="rounded my-1 d-block" :src="isolinesLegendImgDataURL" /> 22 <img class="rounded my-1 d-block" :src="isolinesLegendImgDataURL" />
23 </div> 23 </div>
24 </div> 24 </div>
25 </template> 25 </template>
26 26
48 * * Thomas Junk <thomas.junk@intevation.de> 48 * * Thomas Junk <thomas.junk@intevation.de>
49 * * Bernhard Reiter <bernhard.reiter@intevation.de> 49 * * Bernhard Reiter <bernhard.reiter@intevation.de>
50 */ 50 */
51 import { HTTP } from "@/lib/http"; 51 import { HTTP } from "@/lib/http";
52 import { mapState } from "vuex"; 52 import { mapState } from "vuex";
53 import { LAYERS } from "@/store/map.js";
53 export default { 54 export default {
54 props: ["layername", "layerindex", "isVisible"], 55 props: ["layername", "layerindex", "isVisible"],
55 name: "layerselect", 56 name: "layerselect",
56 components: { 57 components: {
57 LegendElement: () => import("./LegendElement.vue") 58 LegendElement: () => import("./LegendElement.vue")
58 }, 59 },
59 computed: { 60 computed: {
60 ...mapState("map", ["isolinesLegendImgDataURL"]) 61 ...mapState("map", ["isolinesLegendImgDataURL"]),
62 isBottleneckIsolineLayer() {
63 return this.layername == LAYERS.BOTTLENECKISOLINE;
64 }
61 }, 65 },
62 methods: { 66 methods: {
63 visibilityToggled() { 67 visibilityToggled() {
64 this.$emit("visibilityToggled", this.layerindex); 68 this.$emit("visibilityToggled", this.layerindex);
65 } 69 }
66 }, 70 },
67 created() { 71 created() {
68 // fetch legend image for bottleneck isolines 72 // fetch legend image for bottleneck isolines
69 // directly read it as dataURL so it is reusable later 73 // directly read it as dataURL so it is reusable later
70 if (this.layername == "Bottleneck isolines") { 74 if (this.isBottleneckIsolineLayer) {
71 const src = 75 const src =
72 "/internal/wms?REQUEST=GetLegendGraphic&VERSION=1.0.0&FORMAT=image/png&WIDTH=20&HEIGHT=20&LAYER=sounding_results_contour_lines_geoserver&legend_options=columns:4;fontAntiAliasing:true"; 76 "/internal/wms?REQUEST=GetLegendGraphic&VERSION=1.0.0&FORMAT=image/png&WIDTH=20&HEIGHT=20&LAYER=sounding_results_contour_lines_geoserver&legend_options=columns:4;fontAntiAliasing:true";
73 HTTP.get(src, { 77 HTTP.get(src, {
74 headers: { 78 headers: {
75 Accept: "image/png", 79 Accept: "image/png",