Mercurial > gemma
changeset 4210:8962a25d4290 stylesconfig
styles-config: implement layers-styling on the map
| author | Fadi Abbud <fadi.abbud@intevation.de> |
|---|---|
| date | Thu, 15 Aug 2019 12:10:27 +0200 |
| parents | 984bf74ad3cf |
| children | d08247127c21 |
| files | client/src/components/map/Map.vue |
| diffstat | 1 files changed, 83 insertions(+), 22 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/map/Map.vue Thu Aug 15 10:28:43 2019 +0200 +++ b/client/src/components/map/Map.vue Thu Aug 15 12:10:27 2019 +0200 @@ -271,32 +271,93 @@ ); } // load configured bottleneck colors - HTTP.get("/system/style/Bottlenecks/stroke", { + HTTP.get("/system/settings", { headers: { "X-Gemma-Auth": localStorage.getItem("token") } }) .then(response => { - let btlnStrokeC = response.data.code; - HTTP.get("/system/style/Bottlenecks/fill", { - headers: { "X-Gemma-Auth": localStorage.getItem("token") } - }) - .then(response => { - let btlnFillC = response.data.code; - var newStyle = new Style({ - stroke: new Stroke({ - color: btlnStrokeC, - width: 4 - }), - fill: new Fill({ - color: btlnFillC - }) - }); - this.layers.get("BOTTLENECKS").setStyle(newStyle); - this.$store.commit("gauges/deleteNashSutcliffeCache"); - this.$store.dispatch("map/refreshLayers"); - }) - .catch(error => { - console.log(error); + let btlnStrokeC = response.data.bottlenecks_stroke, + btlnFillC = response.data.bottlenecks_fill, + strFillC = response.data.stretches_fill, + strStrokeC = response.data.stretches_stroke, + secStrokeC = response.data.sections_stroke, + secFillC = response.data.sections_fill, + fwd1StrokeC = response.data.fairwaydimensionslos1_stroke, + fwd1FillC = response.data.fairwaydimensionslos1_fill, + fwd2StrokeC = response.data.fairwaydimensionslos2_stroke, + fwd2FillC = response.data.fairwaydimensionslos2_fill, + fwd3StrokeC = response.data.fairwaydimensionslos3_stroke, + fwd3FillC = response.data.fairwaydimensionslos3_fill, + wwpStokeC = response.data.waterwayprofiles_stroke; + let btlnStyle = new Style({ + stroke: new Stroke({ + color: btlnStrokeC, + width: 4 + }), + fill: new Fill({ + color: btlnFillC + }) + }), + strStyle = new Style({ + stroke: new Stroke({ + color: strStrokeC, + width: 2 + }), + fill: new Fill({ + color: strFillC + }) + }), + secStyle = new Style({ + stroke: new Stroke({ + color: secStrokeC, + width: 5 + }), + fill: new Fill({ + color: secFillC + }) + }), + fwd1Style = new Style({ + stroke: new Stroke({ + color: fwd1StrokeC, + width: 2 + }), + fill: new Fill({ + color: fwd1FillC + }) + }), + fwd2Style = new Style({ + stroke: new Stroke({ + color: fwd2StrokeC, + width: 2 + }), + fill: new Fill({ + color: fwd2FillC + }) + }), + fwd3Style = new Style({ + stroke: new Stroke({ + color: fwd3StrokeC, + width: 2 + }), + fill: new Fill({ + color: fwd3FillC + }) + }), + wwpStyle = new Style({ + stroke: new Stroke({ + color: wwpStokeC, + lineDash: [5, 5], + width: 2 + }) }); + this.layers.get("WATERWAYPROFILES").setStyle(wwpStyle); + this.layers.get("FAIRWAYDIMENSIONSLOS1").setStyle(fwd1Style); + this.layers.get("FAIRWAYDIMENSIONSLOS2").setStyle(fwd2Style); + this.layers.get("FAIRWAYDIMENSIONSLOS3").setStyle(fwd3Style); + this.layers.get("SECTIONS").setStyle(secStyle); + this.layers.get("STRETCHES").setStyle(strStyle); + this.layers.get("BOTTLENECKS").setStyle(btlnStyle); + this.$store.commit("gauges/deleteNashSutcliffeCache"); + this.$store.dispatch("map/refreshLayers"); }) .catch(error => { console.log(error);