gemma: client/src/components/map/Map.vue annotate

annotate client/src/components/map/Map.vue @ 5672:b1a10654bf0f

feat: Add Scale to map

author	Thomas Junk <thomas.junk@intevation.de>
date	Wed, 14 Feb 2024 16:56:28 +0100
parents	84d01a536bec
children	e29c942d3e8c

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
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	3 :id="'map-' + paneId"
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	4 :class="['map', { nocursor: this.hasActiveInteractions }]"
3165 891705431545 client: map zoom controls: each map has it's own independent contrls now Markus Kottlaender <markus@intevation.de> parents: 3146 diff changeset	5 >
891705431545 client: map zoom controls: each map has it's own independent contrls now Markus Kottlaender <markus@intevation.de> parents: 3146 diff changeset	6 <Zoom :map="map" />
891705431545 client: map zoom controls: each map has it's own independent contrls now Markus Kottlaender <markus@intevation.de> parents: 3146 diff changeset	7 </div>
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	8 </template>
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	9
5629 84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	10 <style scoped>
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	11 .map {
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	12 width: 100%;
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	13 height: 100%;
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	14 background-color: #eee;
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	15 background-image: linear-gradient(
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	16 45deg,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	17 #e8e8e8 25%,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	18 transparent 25%,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	19 transparent 75%,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	20 #e8e8e8 75%,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	21 #e8e8e8
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	22 ),
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	23 linear-gradient(
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	24 45deg,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	25 #e8e8e8 25%,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	26 transparent 25%,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	27 transparent 75%,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	28 #e8e8e8 75%,
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	29 #e8e8e8
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	30 );
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	31 background-size: 20px 20px;
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	32 background-position: 0 0, 10px 10px;
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	33 }
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	34 .map.nocursor {
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	35 cursor: none;
84d01a536bec Transformed scss and sass styles into css Luisa Beerboom <lbeerboom@intevation.de> parents: 5457 diff changeset	36 }
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	37 </style>
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	38
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	39 <script>
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	40 /* 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	41 * 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	42 *
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	43 * 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	44 * 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	45 *
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	46 * 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	47 * – Ö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	48 * 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	49 *
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	50 * Author(s):
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	51 * * 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	52 * * 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	53 */
5457 fb3e127bccb4 fixed linting errors Thomas Junk <thomas.junk@intevation.de> parents: 5456 diff changeset	54
fb3e127bccb4 fixed linting errors Thomas Junk <thomas.junk@intevation.de> parents: 5456 diff changeset	55 /eslint no-unused-vars: ["error", { "argsIgnorePattern": "_" }]/
fb3e127bccb4 fixed linting errors Thomas Junk <thomas.junk@intevation.de> parents: 5456 diff changeset	56
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	57 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	58 import { mapState } from "vuex";
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	59 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	60 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	61 import { displayError } from "@/lib/errors";
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	62 import { pane } from "@/lib/mixins";
5076 96a544504818 move layer.js and styles.js to layers directory Thomas Junk <thomas.junk@intevation.de> parents: 4869 diff changeset	63 import { layerFactory } from "@/components/layers/layers";
4022 efe0904b1d45 Change of ECDIS no longer requires reload Thomas Junk <thomas.junk@intevation.de> parents: 4003 diff changeset	64 import { ImageWMS as ImageSource } from "ol/source";
5672 b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	65 import { ScaleLine } from "ol/control.js";
5076 96a544504818 move layer.js and styles.js to layers directory Thomas Junk <thomas.junk@intevation.de> parents: 4869 diff changeset	66 import { styles } from "@/components/layers/styles";
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	67 import "ol/ol.css";
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	68
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	69 export default {
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	70 mixins: [pane],
3165 891705431545 client: map zoom controls: each map has it's own independent contrls now Markus Kottlaender <markus@intevation.de> parents: 3146 diff changeset	71 components: {
3166 286c2e3cc105 client: moved Zoom component to map subdirectory Markus Kottlaender <markus@intevation.de> parents: 3165 diff changeset	72 Zoom: () => import("@/components/map/Zoom")
3165 891705431545 client: map zoom controls: each map has it's own independent contrls now Markus Kottlaender <markus@intevation.de> parents: 3146 diff changeset	73 },
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	74 data() {
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	75 return {
3182 77fc44ad05e3 client: removed old splitscreen code Markus Kottlaender <markus@intevation.de> parents: 3181 diff changeset	76 map: null
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	77 };
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	78 },
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	79 computed: {
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	80 ...mapState("map", [
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	81 "initialLoad",
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	82 "extent",
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	83 "syncedMaps",
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	84 "syncedView",
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	85 "ongoingRefresh"
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	86 ]),
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	87 ...mapState("bottlenecks", ["selectedSurvey"]),
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	88 ...mapState("fairwayprofile", ["additionalSurvey"]),
5288 48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	89 ...mapState("application", [
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	90 "paneSetup",
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	91 "paneRotate",
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	92 "config",
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	93 "ongoingPDFExport"
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	94 ]),
3309 80037790032d client: fully implemented sections Markus Kottlaender <markus@intevation.de> parents: 3270 diff changeset	95 ...mapState("imports", ["selectedStretchId", "selectedSectionId"]),
3021 2e2a271c1026 client: fixed layer factory to actually serve different objects Markus Kottlaender <markus@intevation.de> parents: 3016 diff changeset	96 layers() {
3685 8775bea8042a client: layers: unset layer config on logout Markus Kottlaender <markus@intevation.de> parents: 3548 diff changeset	97 return layerFactory(this.paneId);
3021 2e2a271c1026 client: fixed layer factory to actually serve different objects Markus Kottlaender <markus@intevation.de> parents: 3016 diff changeset	98 },
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	99 hasActiveInteractions() {
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	100 return (
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	101 this.map &&
3062 87e0422cffa7 client: draw/cut tools work now with multiple maps Markus Kottlaender <markus@intevation.de> parents: 3057 diff changeset	102 this.map
87e0422cffa7 client: draw/cut tools work now with multiple maps Markus Kottlaender <markus@intevation.de> parents: 3057 diff changeset	103 .getInteractions()
87e0422cffa7 client: draw/cut tools work now with multiple maps Markus Kottlaender <markus@intevation.de> parents: 3057 diff changeset	104 .getArray()
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	105 .filter(
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	106 i =>
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	107 ["linetool", "polygontool", "cuttool"].includes(i.get("id")) &&
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	108 i.getActive()
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	109 ).length
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	110 );
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	111 }
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	112 },
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	113 watch: {
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	114 ongoingRefresh() {
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	115 if (this.ongoingRefresh) return;
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	116 this.loadStyles();
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	117 },
3146 b6cc4838d2c0 client: implemented pane mechanic for diagrams Markus Kottlaender <markus@intevation.de> parents: 3109 diff changeset	118 paneSetup() {
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	119 this.$nextTick(() => this.map.updateSize());
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	120 },
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	121 paneRotate() {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	122 this.$nextTick(() => this.map.updateSize());
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	123 },
3086 a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	124 syncedMaps(syncedMaps) {
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	125 if (syncedMaps.includes(this.paneId) \|\| this.paneId === "main") {
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	126 this.map.setView(this.syncedView);
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	127 } else {
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	128 this.map.setView(
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	129 new View({
4806 a905438a7935 map: disable rotation Thomas Junk <thomas.junk@intevation.de> parents: 4589 diff changeset	130 enableRotation: false,
3086 a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	131 center: [this.extent.lon, this.extent.lat],
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	132 minZoom: 5, // restrict zooming out to ~size of Europe for width 1000px
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	133 zoom: this.extent.zoom,
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	134 projection: "EPSG:3857"
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	135 })
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	136 );
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	137 }
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	138 },
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	139 selectedSurvey(survey) {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	140 if (this.paneId === "main") {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	141 if (survey) {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	142 this.updateBottleneckFilter(survey.bottleneck_id, survey.date_info);
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	143 } else {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	144 this.updateBottleneckFilter("does_not_exist", "1999-10-01");
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	145 }
3062 87e0422cffa7 client: draw/cut tools work now with multiple maps Markus Kottlaender <markus@intevation.de> parents: 3057 diff changeset	146 }
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	147 },
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	148 additionalSurvey(survey) {
3146 b6cc4838d2c0 client: implemented pane mechanic for diagrams Markus Kottlaender <markus@intevation.de> parents: 3109 diff changeset	149 if (this.paneId === "compare-survey") {
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	150 if (survey) {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	151 this.updateBottleneckFilter(survey.bottleneck_id, survey.date_info);
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	152 } else {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	153 this.updateBottleneckFilter("does_not_exist", "1999-10-01");
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	154 }
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	155 }
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	156 },
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	157 selectedStretchId(id) {
4496 8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	158 let stretch = this.layers.get("STRETCHES");
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	159 stretch
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	160 .getSource()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	161 .getFeatures()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	162 .forEach(f => {
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	163 f.set("highlighted", false);
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	164 f.setStyle(null);
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	165 if (id === f.getId()) {
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	166 f.set("highlighted", true);
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	167 let highlight = new Style({
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	168 fill: new Fill({
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	169 color: this.colorLuminance(
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	170 stretch
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	171 .getStyle()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	172 .getFill()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	173 .getColor(),
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	174 0.3
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	175 )
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	176 }),
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	177 stroke: new Stroke({
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	178 color: this.colorLuminance(
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	179 stretch
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	180 .getStyle()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	181 .getStroke()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	182 .getColor(),
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	183 0.3
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	184 ),
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	185 width: 3
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	186 })
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	187 });
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	188 f.setStyle(highlight);
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	189 }
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	190 });
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	191 },
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	192 selectedSectionId(id) {
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	193 let section = this.layers.get("SECTIONS");
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	194 section
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	195 .getSource()
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	196 .getFeatures()
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	197 .forEach(f => {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	198 f.set("highlighted", false);
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	199 if (id === f.getId()) {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	200 f.set("highlighted", true);
4496 8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	201 let highlight = new Style({
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	202 fill: new Fill({
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	203 color: this.colorLuminance(
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	204 section
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	205 .getStyle()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	206 .getFill()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	207 .getColor(),
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	208 0.3
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	209 )
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	210 }),
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	211 stroke: new Stroke({
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	212 color: this.colorLuminance(
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	213 section
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	214 .getStyle()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	215 .getStroke()
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	216 .getColor(),
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	217 0.3
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	218 ),
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	219 width: 4
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	220 })
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	221 });
8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	222 f.setStyle(highlight);
3309 80037790032d client: fully implemented sections Markus Kottlaender <markus@intevation.de> parents: 3270 diff changeset	223 }
80037790032d client: fully implemented sections Markus Kottlaender <markus@intevation.de> parents: 3270 diff changeset	224 });
3011 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 },
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	227 methods: {
4589 9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	228 colorLuminance(color, lum) {
9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	229 let [r, g, b, a] = color
9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	230 .substring(5, color.length - 1)
9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	231 .split(",")
9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	232 .map(e => Number(e));
9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	233 let [r1, g1, b1] = [r, g, b].map(e =>
9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	234 Math.round(Math.min(Math.max(0, e + e * lum), 255))
9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	235 );
9cd00133dff9 client: fix highlighting of stretches and sections Fadi Abbud <fadi.abbud@intevation.de> parents: 4524 diff changeset	236 return `rgba(${r1},${g1},${b1},${a})`;
4496 8c98d801e62e Highlight sections and stretches on select. Raimund Renkert <raimund@renkert.org> parents: 4455 diff changeset	237 },
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	238 updateBottleneckFilter(bottleneck_id, datestr) {
4003 5d4edf268aec if no bottlenck is given the update bottleneck filter should not query the geoserver Thomas Junk <thomas.junk@intevation.de> parents: 3852 diff changeset	239 if (!bottleneck_id) return;
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	240 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	241 if (exists) {
3021 2e2a271c1026 client: fixed layer factory to actually serve different objects Markus Kottlaender <markus@intevation.de> parents: 3016 diff changeset	242 this.layers
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	243 .get("BOTTLENECKISOLINE")
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	244 .getSource()
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	245 .updateParams({
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	246 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	247 });
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	248 }
3021 2e2a271c1026 client: fixed layer factory to actually serve different objects Markus Kottlaender <markus@intevation.de> parents: 3016 diff changeset	249 this.layers.get("BOTTLENECKISOLINE").setVisible(exists);
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	250 },
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	251 initMap() {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	252 if (!this.syncedView) {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	253 this.$store.commit(
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	254 "map/syncedView",
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	255 new View({
4806 a905438a7935 map: disable rotation Thomas Junk <thomas.junk@intevation.de> parents: 4589 diff changeset	256 enableRotation: false,
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	257 center: [this.extent.lon, this.extent.lat],
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	258 minZoom: 5, // restrict zooming out to ~size of Europe for width 1000px
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	259 zoom: this.extent.zoom,
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	260 projection: "EPSG:3857"
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	261 })
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	262 );
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	263 }
3181 c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	264
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	265 // move to user specific default extent if map loads for the first time
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	266 // checking initialLoad will be obsolete once we abandoned the separated admin context
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	267 if (this.initialLoad) {
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	268 this.$store.commit("map/initialLoad", false);
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	269 var currentUser = this.$store.state.user.user;
4426 a769e14f4baf fix typo, encodeURIComponent only for username Thomas Junk <thomas.junk@intevation.de> parents: 4422 diff changeset	270 HTTP.get("/users/" + encodeURIComponent(`${currentUser}`), {
3181 c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	271 headers: {
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	272 "X-Gemma-Auth": localStorage.getItem("token"),
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	273 "Content-type": "text/xml; charset=UTF-8"
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	274 }
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	275 })
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	276 .then(response => {
4422 562f9da8ba0b map: restore zoom to extent functionality Thomas Junk <thomas.junk@intevation.de> parents: 4421 diff changeset	277 this.mountMap();
3181 c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	278 this.$store.dispatch("map/moveToBoundingBox", {
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	279 boundingBox: [
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	280 response.data.extent.x1,
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	281 response.data.extent.y1,
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	282 response.data.extent.x2,
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	283 response.data.extent.y2
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	284 ],
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	285 zoom: 17,
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	286 preventZoomOut: true,
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	287 duration: 0
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	288 });
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	289 })
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	290 .catch(error => {
4422 562f9da8ba0b map: restore zoom to extent functionality Thomas Junk <thomas.junk@intevation.de> parents: 4421 diff changeset	291 this.mountMap();
4869 6b054b91d9b2 backend not reachable as error message etd. Login adjusted Thomas Junk <thomas.junk@intevation.de> parents: 4868 diff changeset	292 let message = "Backend not reachable";
4868 008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	293 if (error.response) {
008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	294 const { status, data } = error.response;
008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	295 message = `${status}: ${data.message \|\| data}`;
008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	296 }
3181 c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	297 displayError({
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	298 title: this.$gettext("Backend Error"),
4868 008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	299 message: message
3181 c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	300 });
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	301 });
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	302 } else {
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	303 this.mountMap();
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	304 }
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	305 },
c122a064fd5e client: map: fixed loading animation for layers Markus Kottlaender <markus@intevation.de> parents: 3177 diff changeset	306 mountMap() {
4022 efe0904b1d45 Change of ECDIS no longer requires reload Thomas Junk <thomas.junk@intevation.de> parents: 4003 diff changeset	307 const source = new ImageSource({
efe0904b1d45 Change of ECDIS no longer requires reload Thomas Junk <thomas.junk@intevation.de> parents: 4003 diff changeset	308 preload: 1,
efe0904b1d45 Change of ECDIS no longer requires reload Thomas Junk <thomas.junk@intevation.de> parents: 4003 diff changeset	309 url: this.config.ecdis_wms_url,
efe0904b1d45 Change of ECDIS no longer requires reload Thomas Junk <thomas.junk@intevation.de> parents: 4003 diff changeset	310 crossOrigin: "anonymous",
efe0904b1d45 Change of ECDIS no longer requires reload Thomas Junk <thomas.junk@intevation.de> parents: 4003 diff changeset	311 params: JSON.parse(this.config.ecdis_wms_params)
efe0904b1d45 Change of ECDIS no longer requires reload Thomas Junk <thomas.junk@intevation.de> parents: 4003 diff changeset	312 });
5457 fb3e127bccb4 fixed linting errors Thomas Junk <thomas.junk@intevation.de> parents: 5456 diff changeset	313 source.on("imageloaderror", _ => {
5288 48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	314 if (this.ongoingPDFExport) {
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	315 displayError({
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	316 title: this.$gettext("Loading Error"),
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	317 message: this.$gettext(
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	318 "The ECDIS chart could not be loaded completely, the map might be corrupted. Please retry later"
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	319 ),
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	320 options: {
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	321 timeout: 0,
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	322 showProgressBar: false,
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	323 closeOnClick: true,
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	324 pauseOnHover: true,
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	325 bodyMaxLength: 1024
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	326 }
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	327 });
48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	328 }
5280 03b8fe8467de client: display toast message due to loading layer error ("INLANDECDIS") Fadi Abbud <fadi.abbud@intevation.de> parents: 5076 diff changeset	329 });
5288 48bef30cdb72 Client: limit displaying of error popup to only pdf-export mode(ECDIS layer) Fadi Abbud <fadi.abbud@intevation.de> parents: 5280 diff changeset	330
4022 efe0904b1d45 Change of ECDIS no longer requires reload Thomas Junk <thomas.junk@intevation.de> parents: 4003 diff changeset	331 this.layers.get("INLANDECDIS").setSource(source);
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	332 this.map = new Map({
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	333 layers: this.layers.config,
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	334 target: "map-" + this.paneId,
5672 b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	335 controls: [new ScaleLine()],
3086 a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	336 view:
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	337 this.syncedMaps.includes(this.paneId) \|\| this.paneId === "main"
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	338 ? this.syncedView
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	339 : new View({
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	340 center: [this.extent.lon, this.extent.lat],
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	341 minZoom: 5,
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	342 zoom: this.extent.zoom,
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	343 projection: "EPSG:3857"
a69a8deb56fe client: added button to sync/unsync maps when comparing sounding results Markus Kottlaender <markus@intevation.de> parents: 3079 diff changeset	344 })
3079 57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	345 });
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	346 this.map.getLayer = id => this.layers.get(id);
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	347 // store map position on every move
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	348 // will be obsolete once we abandoned the separated admin context
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	349 this.map.on("moveend", event => {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	350 const center = event.map.getView().getCenter();
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	351 this.$store.commit("map/extent", {
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	352 lat: center[1],
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	353 lon: center[0],
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	354 zoom: event.map.getView().getZoom()
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	355 });
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	356 });
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	357 this.$store.dispatch("map/openLayersMap", this.map);
57255fda7594 client: compare surveys on map Markus Kottlaender <markus@intevation.de> parents: 3077 diff changeset	358 this.$store.dispatch("map/initIdentifyTool", this.map);
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	359 },
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	360 loadStyles() {
4507 a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	361 const getRGBA = color => {
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	362 return (
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	363 "rgba(" +
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	364 parseInt(color.slice(1, 3), 16) +
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	365 ", " +
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	366 parseInt(color.slice(3, 5), 16) +
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	367 ", " +
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	368 parseInt(color.slice(5, 7), 16) +
4524 7cca4aa9a04a Client: Map: improve rgba() values calculation for styling Fadi Abbud <fadi.abbud@intevation.de> parents: 4507 diff changeset	369 ", " +
7cca4aa9a04a Client: Map: improve rgba() values calculation for styling Fadi Abbud <fadi.abbud@intevation.de> parents: 4507 diff changeset	370 (color.length > 7 ? parseInt(color.slice(7, 9), 16) / 255 : "1") +
4507 a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	371 ")"
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	372 );
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	373 };
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	374 // load configured bottleneck colors
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	375 HTTP.get("/system/settings", {
315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	376 headers: { "X-Gemma-Auth": localStorage.getItem("token") }
4455 112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	377 }).then(response => {
4507 a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	378 let btlnStrokeC = getRGBA(response.data.bottlenecks_stroke),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	379 btlnFillC = getRGBA(response.data.bottlenecks_fill),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	380 strFillC = getRGBA(response.data.stretches_fill),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	381 strStrokeC = getRGBA(response.data.stretches_stroke),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	382 secStrokeC = getRGBA(response.data.sections_stroke),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	383 secFillC = getRGBA(response.data.sections_fill),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	384 fwd1StrokeC = getRGBA(response.data.fairwaydimensionslos1_stroke),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	385 fwd1FillC = getRGBA(response.data.fairwaydimensionslos1_fill),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	386 fwd2StrokeC = getRGBA(response.data.fairwaydimensionslos2_stroke),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	387 fwd2FillC = getRGBA(response.data.fairwaydimensionslos2_fill),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	388 fwd3StrokeC = getRGBA(response.data.fairwaydimensionslos3_stroke),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	389 fwd3FillC = getRGBA(response.data.fairwaydimensionslos3_fill),
a912b1458834 client: Map: use rgba for styling layers Fadi Abbud <fadi.abbud@intevation.de> parents: 4496 diff changeset	390 wwpStokeC = getRGBA(response.data.waterwayprofiles_stroke);
4455 112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	391 let btlnStyle = new Style({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	392 stroke: new Stroke({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	393 color: btlnStrokeC,
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	394 width: 4
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	395 }),
4455 112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	396 fill: new Fill({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	397 color: btlnFillC
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	398 })
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	399 }),
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	400 strStyle = new Style({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	401 stroke: new Stroke({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	402 color: strStrokeC,
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	403 width: 2
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	404 }),
4455 112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	405 fill: new Fill({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	406 color: strFillC
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	407 })
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	408 }),
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	409 secStyle = new Style({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	410 stroke: new Stroke({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	411 color: secStrokeC,
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	412 width: 5
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	413 }),
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	414 fill: new Fill({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	415 color: secFillC
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	416 })
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	417 }),
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	418 fwd1Style = new Style({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	419 stroke: new Stroke({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	420 lineDash: [2, 4],
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	421 lineCap: "round",
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	422 color: fwd1StrokeC,
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	423 width: 2
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	424 }),
4455 112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	425 fill: new Fill({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	426 color: fwd1FillC
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	427 })
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	428 }),
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	429 fwd2Style = new Style({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	430 stroke: new Stroke({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	431 lineDash: [3, 6],
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	432 lineCap: "round",
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	433 color: fwd2StrokeC,
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	434 width: 2
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	435 }),
4455 112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	436 fill: new Fill({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	437 color: fwd2FillC
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	438 })
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	439 }),
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	440 fwd3Style = new Style({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	441 stroke: new Stroke({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	442 color: fwd3StrokeC,
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	443 width: 2
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	444 }),
4455 112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	445 fill: new Fill({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	446 color: fwd3FillC
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	447 })
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	448 }),
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	449 wwpStyle = new Style({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	450 stroke: new Stroke({
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	451 color: wwpStokeC,
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	452 lineDash: [5, 5],
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	453 width: 2
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	454 })
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	455 });
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	456 this.layers.get("WATERWAYPROFILES").setStyle(wwpStyle);
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	457 this.layers
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	458 .get("FAIRWAYDIMENSIONSLOS1")
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	459 .setStyle(() => [fwd1Style, styles.textFW1]);
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	460 this.layers
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	461 .get("FAIRWAYDIMENSIONSLOS2")
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	462 .setStyle(() => [fwd2Style, styles.textFW2]);
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	463 this.layers
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	464 .get("FAIRWAYDIMENSIONSLOS3")
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	465 .setStyle(() => [fwd3Style, styles.textFW3]);
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	466 this.layers.get("SECTIONS").setStyle(secStyle);
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	467 this.layers.get("STRETCHES").setStyle(strStyle);
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	468 this.layers.get("BOTTLENECKS").setStyle(btlnStyle);
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	469 this.$store.commit("gauges/deleteNashSutcliffeCache");
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	470 this.$store.dispatch("map/refreshLayers");
112120ed510d removed empty catch statement Thomas Junk <thomas.junk@intevation.de> parents: 4454 diff changeset	471 });
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	472 }
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	473 },
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	474 mounted() {
3102 a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	475 // ToDo set path to correct endpoint in order to retrieve an OSM URL
3104 19fc84a98479 Added "published-config" field to configuration. Sascha L. Teichmann <sascha.teichmann@intevation.de> parents: 3102 diff changeset	476 HTTP.get("/system/config", {
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	477 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	478 })
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	479 .then(response => {
3270 d7bc51fd50b0 client: map layers: integrated osm layer into main layer configuration file Markus Kottlaender <markus@intevation.de> parents: 3182 diff changeset	480 if (response.data["osm-url"]) {
d7bc51fd50b0 client: map layers: integrated osm layer into main layer configuration file Markus Kottlaender <markus@intevation.de> parents: 3182 diff changeset	481 this.layers
d7bc51fd50b0 client: map layers: integrated osm layer into main layer configuration file Markus Kottlaender <markus@intevation.de> parents: 3182 diff changeset	482 .get("OPENSTREETMAP")
d7bc51fd50b0 client: map layers: integrated osm layer into main layer configuration file Markus Kottlaender <markus@intevation.de> parents: 3182 diff changeset	483 .getSource()
d7bc51fd50b0 client: map layers: integrated osm layer into main layer configuration file Markus Kottlaender <markus@intevation.de> parents: 3182 diff changeset	484 .setUrl(response.data["osm-url"]);
3109 973312bb77c6 Client: Fixed usage of published config to configure the OSM server URL. Sascha L. Teichmann <sascha.teichmann@intevation.de> parents: 3104 diff changeset	485 }
3102 a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	486 this.initMap();
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	487
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	488 if (this.selectedSurvey && this.paneId === "main") {
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	489 this.updateBottleneckFilter(
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	490 this.selectedSurvey.bottleneck_id,
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	491 this.selectedSurvey.date_info
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	492 );
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	493 }
3146 b6cc4838d2c0 client: implemented pane mechanic for diagrams Markus Kottlaender <markus@intevation.de> parents: 3109 diff changeset	494 if (this.additionalSurvey && this.paneId === "compare-survey") {
3102 a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	495 this.updateBottleneckFilter(
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	496 this.additionalSurvey.bottleneck_id,
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	497 this.additionalSurvey.date_info
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	498 );
a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	499 }
4271 315474a66589 Map: refreshing layers triggers reloading of styles Thomas Junk <thomas.junk@intevation.de> parents: 4252 diff changeset	500 this.loadStyles();
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	501 })
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	502 .catch(error => {
4869 6b054b91d9b2 backend not reachable as error message etd. Login adjusted Thomas Junk <thomas.junk@intevation.de> parents: 4868 diff changeset	503 let message = "Backend not reachable";
4868 008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	504 if (error.response) {
008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	505 const { status, data } = error.response;
008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	506 message = `${status}: ${data.message \|\| data}`;
008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	507 }
3102 a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	508 displayError({
4868 008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	509 title: this.$gettext("Backend Error"),
008bc1ae8897 exception handling Thomas Junk <thomas.junk@intevation.de> parents: 4806 diff changeset	510 message: message
3102 a9c7825303b3 layers: Code for provisioning a dynamic URL for OSM etd. Thomas Junk <thomas.junk@intevation.de> parents: 3086 diff changeset	511 });
3011 fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	512 });
3052 01210542e028 client: remove openlayers map objects after removing a map component from the view Markus Kottlaender <markus@intevation.de> parents: 3051 diff changeset	513 },
01210542e028 client: remove openlayers map objects after removing a map component from the view Markus Kottlaender <markus@intevation.de> parents: 3051 diff changeset	514 destroyed() {
01210542e028 client: remove openlayers map objects after removing a map component from the view Markus Kottlaender <markus@intevation.de> parents: 3051 diff changeset	515 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	516 }
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	517 };
fc8fbea24568 client: moved map component, layer factory and styles to own subdirectory Markus Kottlaender <markus@intevation.de> parents: diff changeset	518 </script>
5672 b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	519
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	520 <style>
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	521 .ol-scale-line {
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	522 background: rgba(0, 0, 0, 0.45);
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	523 border-radius: 4px;
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	524 bottom: 8px;
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	525 left: 8px;
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	526 padding: 2px;
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	527 position: absolute;
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	528 }
b1a10654bf0f feat: Add Scale to map Thomas Junk <thomas.junk@intevation.de> parents: 5629 diff changeset	529 </style>

Mercurial > gemma

annotate client/src/components/map/Map.vue @ 5672:b1a10654bf0f