Mercurial > gemma
changeset 4507:a912b1458834
client: Map: use rgba for styling layers
author | Fadi Abbud <fadi.abbud@intevation.de> |
---|---|
date | Wed, 02 Oct 2019 16:25:10 +0200 |
parents | e020e6e34ad7 |
children | d53c78cd53f3 |
files | client/src/components/map/Map.vue |
diffstat | 1 files changed, 27 insertions(+), 13 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/map/Map.vue Wed Oct 02 16:09:10 2019 +0200 +++ b/client/src/components/map/Map.vue Wed Oct 02 16:25:10 2019 +0200 @@ -319,23 +319,37 @@ this.$store.dispatch("map/initIdentifyTool", this.map); }, loadStyles() { + const getRGBA = color => { + return ( + "rgba(" + + parseInt(color.slice(1, 3), 16) + + ", " + + parseInt(color.slice(3, 5), 16) + + ", " + + parseInt(color.slice(5, 7), 16) + + (color.length > 7 + ? ", " + parseInt(color.slice(7, 9), 16) / 255 + : "") + + ")" + ); + }; // load configured bottleneck colors HTTP.get("/system/settings", { headers: { "X-Gemma-Auth": localStorage.getItem("token") } }).then(response => { - 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 btlnStrokeC = getRGBA(response.data.bottlenecks_stroke), + btlnFillC = getRGBA(response.data.bottlenecks_fill), + strFillC = getRGBA(response.data.stretches_fill), + strStrokeC = getRGBA(response.data.stretches_stroke), + secStrokeC = getRGBA(response.data.sections_stroke), + secFillC = getRGBA(response.data.sections_fill), + fwd1StrokeC = getRGBA(response.data.fairwaydimensionslos1_stroke), + fwd1FillC = getRGBA(response.data.fairwaydimensionslos1_fill), + fwd2StrokeC = getRGBA(response.data.fairwaydimensionslos2_stroke), + fwd2FillC = getRGBA(response.data.fairwaydimensionslos2_fill), + fwd3StrokeC = getRGBA(response.data.fairwaydimensionslos3_stroke), + fwd3FillC = getRGBA(response.data.fairwaydimensionslos3_fill), + wwpStokeC = getRGBA(response.data.waterwayprofiles_stroke); let btlnStyle = new Style({ stroke: new Stroke({ color: btlnStrokeC,