Mercurial > gemma

annotate client/src/store/gauges.js @ 3152:8e31e5b9b37a

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
client: gauge diagrams: refresh data when switching between gauges
author Markus Kottlaender <markus@intevation.de>
date Fri, 03 May 2019 13:51:09 +0200
parents 762b140e91a0
children d7cc5cda82a9
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
2590
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
1 /* This is Free Software under GNU Affero General Public License v >= 3.0
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
2 * without warranty, see README.md and license for details.
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
3 *
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
4 * SPDX-License-Identifier: AGPL-3.0-or-later
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
5 * License-Filename: LICENSES/AGPL-3.0.txt
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
6 *
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
7 * Copyright (C) 2018 by via donau
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
8 * – Österreichische Wasserstraßen-Gesellschaft mbH
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
9 * Software engineering by Intevation GmbH
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
10 *
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
11 * Author(s):
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
12 * Markus Kottländer <markus@intevation.de>
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
13 */
2596
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
14 import { HTTP } from "@/lib/http";
2985
1b8bb4f89227 client: removed .js and .vue extention from imports
Markus Kottlaender <markus@intevation.de>
parents: 2830
diff changeset
15 import { WFS } from "ol/format";
2764
f0846d200ce4 client: waterlevel diagram: remove past predictions from waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2761
diff changeset
16 import { isPast } from "date-fns";
2590
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
17
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
18 let dateFrom = new Date();
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
19 dateFrom.setDate(dateFrom.getDate() - 30);
2775
2feb9f8f6c66 client: waterlevel diagram: implemented display of forecast data
Markus Kottlaender <markus@intevation.de>
parents: 2764
diff changeset
20 let dateTo = new Date();
2feb9f8f6c66 client: waterlevel diagram: implemented display of forecast data
Markus Kottlaender <markus@intevation.de>
parents: 2764
diff changeset
21 dateTo.setDate(dateTo.getDate() + 3);
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
22
2590
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
23 const init = () => {
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
24 return {
2596
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
25 gauges: [],
2643
27933e66e848 client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents: 2604
diff changeset
26 selectedGaugeISRS: null,
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
27 waterlevels: [],
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
28 longtermWaterlevels: [],
2830
0632d543a427 client: spuc7/8: show time periods in diagram titles
Markus Kottlaender <markus@intevation.de>
parents: 2829
diff changeset
29 longtermInterval: [],
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
30 yearWaterlevels: [],
2751
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
31 nashSutcliffe: null,
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
32 dateFrom: dateFrom,
2829
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
33 dateTo: dateTo,
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
34 yearCompare: new Date().getFullYear()
2590
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
35 };
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
36 };
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
37
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
38 export default {
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
39 init,
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
40 namespaced: true,
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
41 state: init(),
2604
85f9bf4a6eba client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents: 2596
diff changeset
42 getters: {
85f9bf4a6eba client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents: 2596
diff changeset
43 selectedGauge: state => {
85f9bf4a6eba client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents: 2596
diff changeset
44 return state.gauges.find(
2643
27933e66e848 client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents: 2604
diff changeset
45 g => g.properties.isrs_code === state.selectedGaugeISRS
2604
85f9bf4a6eba client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents: 2596
diff changeset
46 );
85f9bf4a6eba client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents: 2596
diff changeset
47 }
85f9bf4a6eba client: gauge waterlevel diagram: draw reference waterlevels
Markus Kottlaender <markus@intevation.de>
parents: 2596
diff changeset
48 },
2590
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
49 mutations: {
2596
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
50 gauges: (state, gauges) => {
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
51 state.gauges = gauges;
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
52 },
2643
27933e66e848 client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents: 2604
diff changeset
53 selectedGaugeISRS: (state, isrs) => {
27933e66e848 client: gauges: use isrs_code as unique id for gauges
Markus Kottlaender <markus@intevation.de>
parents: 2604
diff changeset
54 state.selectedGaugeISRS = isrs;
2596
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
55 },
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
56 waterlevels: (state, data) => {
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
57 state.waterlevels = data;
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
58 },
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
59 longtermWaterlevels: (state, data) => {
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
60 state.longtermWaterlevels = data;
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
61 },
2830
0632d543a427 client: spuc7/8: show time periods in diagram titles
Markus Kottlaender <markus@intevation.de>
parents: 2829
diff changeset
62 longtermInterval: (state, interval) => {
0632d543a427 client: spuc7/8: show time periods in diagram titles
Markus Kottlaender <markus@intevation.de>
parents: 2829
diff changeset
63 state.longtermInterval = interval;
0632d543a427 client: spuc7/8: show time periods in diagram titles
Markus Kottlaender <markus@intevation.de>
parents: 2829
diff changeset
64 },
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
65 yearWaterlevels: (state, data) => {
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
66 state.yearWaterlevels = data;
2761
71e7237110ba client: spuc8: prepared diagram
Markus Kottlaender <markus@intevation.de>
parents: 2751
diff changeset
67 },
2751
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
68 nashSutcliffe: (state, data) => {
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
69 state.nashSutcliffe = data;
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
70 },
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
71 dateFrom: (state, dateFrom) => {
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
72 state.dateFrom = dateFrom;
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
73 },
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
74 dateTo: (state, dateTo) => {
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
75 state.dateTo = dateTo;
2829
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
76 },
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
77 yearCompare: (state, year) => {
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
78 state.yearCompare = year;
2590
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
79 }
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
80 },
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
81 actions: {
3152
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
82 selectedGaugeISRS: ({ commit, dispatch, state }, isrs) => {
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
83 if (state.selectedGaugeISRS !== isrs) {
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
84 commit("selectedGaugeISRS", isrs);
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
85 commit("application/showGauges", true, { root: true });
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
86 dispatch("loadWaterlevels");
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
87 dispatch("loadLongtermWaterlevels");
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
88 dispatch("loadYearWaterlevels");
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
89 dispatch("loadNashSutcliffe");
8e31e5b9b37a client: gauge diagrams: refresh data when switching between gauges
Markus Kottlaender <markus@intevation.de>
parents: 3042
diff changeset
90 }
2596
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
91 },
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
92 loadGauges: ({ commit }) => {
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
93 return new Promise((resolve, reject) => {
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
94 var gaugesFeatureCollectionRequest = new WFS().writeGetFeature({
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
95 srsName: "EPSG:4326",
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
96 featureNS: "gemma",
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
97 featurePrefix: "gemma",
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
98 featureTypes: ["gauges_geoserver"],
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
99 outputFormat: "application/json"
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
100 });
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
101 HTTP.post(
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
102 "/internal/wfs",
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
103 new XMLSerializer().serializeToString(gaugesFeatureCollectionRequest),
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
104 {
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
105 headers: {
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
106 "X-Gemma-Auth": localStorage.getItem("token"),
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
107 "Content-type": "text/xml; charset=UTF-8"
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
108 }
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
109 }
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
110 )
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
111 .then(response => {
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
112 commit("gauges", response.data.features);
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
113 resolve(response);
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
114 })
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
115 .catch(error => {
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
116 reject(error);
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
117 });
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
118 });
8774054959a7 client: added Gauges dialog/tool to show waterlevel diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2590
diff changeset
119 },
2744
7dcca9649a61 client: waterlevel diagram: use selectedGaugeISRS to load waterlevels
Markus Kottlaender <markus@intevation.de>
parents: 2716
diff changeset
120 loadWaterlevels({ state, commit }) {
2701
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
121 // include the last day
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
122 let dateTo = new Date(state.dateTo.getTime() + 86400);
2657
b6865a08c905 client: waterlevel diagram: use real test data
Markus Kottlaender <markus@intevation.de>
parents: 2643
diff changeset
123
2701
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
124 return new Promise((resolve, reject) => {
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
125 HTTP.get(
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
126 `/data/waterlevels/${
2744
7dcca9649a61 client: waterlevel diagram: use selectedGaugeISRS to load waterlevels
Markus Kottlaender <markus@intevation.de>
parents: 2716
diff changeset
127 state.selectedGaugeISRS
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
128 }?from=${state.dateFrom
2701
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
129 .toISOString()
2710
f393fabfdd35 client: waterlevel diagram: chart extent based on selected dates instead of data
Markus Kottlaender <markus@intevation.de>
parents: 2701
diff changeset
130 .substr(0, 23)}&to=${dateTo.toISOString().substr(0, 23)}`,
2701
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
131 {
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
132 headers: { "X-Gemma-Auth": localStorage.getItem("token") }
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
133 }
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
134 )
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
135 .then(response => {
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
136 let data = response.data
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
137 .split("\n")
2828
c2b90cb426ed client: waterlevels: better filtering of comment lines in API results
Markus Kottlaender <markus@intevation.de>
parents: 2815
diff changeset
138 // remove empty rows and rows starting with #
c2b90cb426ed client: waterlevels: better filtering of comment lines in API results
Markus Kottlaender <markus@intevation.de>
parents: 2815
diff changeset
139 .filter(wl => wl && wl[0] !== "#")
2701
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
140 .map(wl => {
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
141 wl = wl.split(",");
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
142 return {
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
143 date: new Date(wl[0]),
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
144 waterlevel: Number(wl[1]),
2793
16d08532c420 client: waterlevel diagram: added prediction's min max values to parsing of waterlevel csv
Markus Kottlaender <markus@intevation.de>
parents: 2791
diff changeset
145 min: Number(wl[2]),
16d08532c420 client: waterlevel diagram: added prediction's min max values to parsing of waterlevel csv
Markus Kottlaender <markus@intevation.de>
parents: 2791
diff changeset
146 max: Number(wl[3]),
16d08532c420 client: waterlevel diagram: added prediction's min max values to parsing of waterlevel csv
Markus Kottlaender <markus@intevation.de>
parents: 2791
diff changeset
147 predicted: wl[4] === "f" ? false : true
2701
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
148 };
2764
f0846d200ce4 client: waterlevel diagram: remove past predictions from waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2761
diff changeset
149 })
f0846d200ce4 client: waterlevel diagram: remove past predictions from waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2761
diff changeset
150 .filter(wl => !(wl.predicted && isPast(wl.date)));
2701
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
151 data = data.sort((a, b) => a.date - b.date);
2692
966c94e699fa client: waterlevel diagram: simulate loading time and removed old demo code
Markus Kottlaender <markus@intevation.de>
parents: 2657
diff changeset
152 commit("waterlevels", data);
966c94e699fa client: waterlevel diagram: simulate loading time and removed old demo code
Markus Kottlaender <markus@intevation.de>
parents: 2657
diff changeset
153 resolve(data);
2701
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
154 })
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
155 .catch(error => {
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
156 commit("waterlevels", []);
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
157 reject(error);
e622689d73bd client: waterlevel diagram: use endpoint
Markus Kottlaender <markus@intevation.de>
parents: 2692
diff changeset
158 });
2590
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
159 });
2751
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
160 },
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
161 loadLongtermWaterlevels({ state, commit }) {
2791
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
162 return new Promise((resolve, reject) => {
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
163 HTTP.get(`/data/longterm-waterlevels/${state.selectedGaugeISRS}`, {
2791
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
164 headers: { "X-Gemma-Auth": localStorage.getItem("token") }
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
165 })
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
166 .then(response => {
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
167 const now = new Date();
2830
0632d543a427 client: spuc7/8: show time periods in diagram titles
Markus Kottlaender <markus@intevation.de>
parents: 2829
diff changeset
168 let data = response.data.split("\n");
0632d543a427 client: spuc7/8: show time periods in diagram titles
Markus Kottlaender <markus@intevation.de>
parents: 2829
diff changeset
169 // get result interval from first line
3042
762b140e91a0 client: gauges: if interval is only one year display only that one year
Markus Kottlaender <markus@intevation.de>
parents: 2985
diff changeset
170 let interval = data[0]
762b140e91a0 client: gauges: if interval is only one year display only that one year
Markus Kottlaender <markus@intevation.de>
parents: 2985
diff changeset
171 .split(",")[0]
762b140e91a0 client: gauges: if interval is only one year display only that one year
Markus Kottlaender <markus@intevation.de>
parents: 2985
diff changeset
172 .split(" ")[1]
762b140e91a0 client: gauges: if interval is only one year display only that one year
Markus Kottlaender <markus@intevation.de>
parents: 2985
diff changeset
173 .split("-")
762b140e91a0 client: gauges: if interval is only one year display only that one year
Markus Kottlaender <markus@intevation.de>
parents: 2985
diff changeset
174 .map(y => Number(y));
762b140e91a0 client: gauges: if interval is only one year display only that one year
Markus Kottlaender <markus@intevation.de>
parents: 2985
diff changeset
175 if (interval[0] === interval[1]) interval = [interval[0]];
762b140e91a0 client: gauges: if interval is only one year display only that one year
Markus Kottlaender <markus@intevation.de>
parents: 2985
diff changeset
176 commit("longtermInterval", interval);
2830
0632d543a427 client: spuc7/8: show time periods in diagram titles
Markus Kottlaender <markus@intevation.de>
parents: 2829
diff changeset
177 data = data
2828
c2b90cb426ed client: waterlevels: better filtering of comment lines in API results
Markus Kottlaender <markus@intevation.de>
parents: 2815
diff changeset
178 // remove empty rows and rows starting with #
c2b90cb426ed client: waterlevels: better filtering of comment lines in API results
Markus Kottlaender <markus@intevation.de>
parents: 2815
diff changeset
179 .filter(wl => wl && wl[0] !== "#")
2791
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
180 .map(wl => {
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
181 wl = wl.split(",");
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
182 let dayAndMonth = wl[0].split("-").map(n => Number(n));
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
183 let date = new Date(
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
184 now.getFullYear(),
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
185 dayAndMonth[1] - 1,
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
186 dayAndMonth[0]
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
187 );
2791
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
188 return {
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
189 date: date,
2791
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
190 min: Number(wl[1]),
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
191 max: Number(wl[2]),
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
192 mean: Number(wl[3]),
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
193 median: Number(wl[4]),
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
194 q25: Number(wl[5]),
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
195 q75: Number(wl[6])
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
196 };
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
197 });
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
198 data = data.sort((a, b) => a.date - b.date);
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
199 commit("longtermWaterlevels", data);
2791
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
200 resolve(data);
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
201 })
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
202 .catch(error => {
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
203 commit("longtermWaterlevels", []);
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
204 reject(error);
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
205 });
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
206 });
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
207 },
2829
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
208 loadYearWaterlevels({ state, commit }) {
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
209 return new Promise((resolve, reject) => {
2829
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
210 HTTP.get(
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
211 `/data/year-waterlevels/${state.selectedGaugeISRS}/${
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
212 state.yearCompare
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
213 }`,
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
214 {
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
215 headers: { "X-Gemma-Auth": localStorage.getItem("token") }
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
216 }
4a1211727d5f client: spuc8: implemented year controls
Markus Kottlaender <markus@intevation.de>
parents: 2828
diff changeset
217 )
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
218 .then(response => {
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
219 const now = new Date();
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
220 let data = response.data
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
221 .split("\n")
2828
c2b90cb426ed client: waterlevels: better filtering of comment lines in API results
Markus Kottlaender <markus@intevation.de>
parents: 2815
diff changeset
222 // remove empty rows and rows starting with #
c2b90cb426ed client: waterlevels: better filtering of comment lines in API results
Markus Kottlaender <markus@intevation.de>
parents: 2815
diff changeset
223 .filter(wl => wl && wl[0] !== "#")
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
224 .map(wl => {
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
225 wl = wl.split(",");
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
226 let dayAndMonth = wl[0].split("-").map(n => Number(n));
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
227 let date = new Date(
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
228 now.getFullYear(),
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
229 dayAndMonth[1] - 1,
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
230 dayAndMonth[0]
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
231 );
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
232 return {
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
233 date: date,
2815
12f053763be2 client: spuc8: finished drawing charts, optimized code
Markus Kottlaender <markus@intevation.de>
parents: 2813
diff changeset
234 mean: Number(wl[1])
2813
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
235 };
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
236 });
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
237 data = data.sort((a, b) => a.date - b.date);
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
238 commit("yearWaterlevels", data);
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
239 resolve(data);
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
240 })
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
241 .catch(error => {
49c1570919ae client: spuc8: use new endpoints to fetch year based and longterm waterlevel data
Markus Kottlaender <markus@intevation.de>
parents: 2793
diff changeset
242 commit("yearWaterlevels", []);
2791
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
243 reject(error);
2b79c0871138 client: spuc8: draw diagrams
Markus Kottlaender <markus@intevation.de>
parents: 2775
diff changeset
244 });
2761
71e7237110ba client: spuc8: prepared diagram
Markus Kottlaender <markus@intevation.de>
parents: 2751
diff changeset
245 });
71e7237110ba client: spuc8: prepared diagram
Markus Kottlaender <markus@intevation.de>
parents: 2751
diff changeset
246 },
2751
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
247 loadNashSutcliffe({ state, commit }) {
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
248 return new Promise((resolve, reject) => {
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
249 HTTP.get(`/data/nash-sutcliffe/${state.selectedGaugeISRS}`, {
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
250 headers: { "X-Gemma-Auth": localStorage.getItem("token") }
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
251 })
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
252 .then(response => {
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
253 commit("nashSutcliffe", response.data);
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
254 resolve(response.data);
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
255 })
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
256 .catch(error => {
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
257 commit("nashSutcliffe", null);
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
258 reject(error);
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
259 });
5da81634bdc4 client: waterlevel diagram: implemented nash-sutcliffe
Markus Kottlaender <markus@intevation.de>
parents: 2744
diff changeset
260 });
2590
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
261 }
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
262 }
1686ec185155 client: added gauge waterlevel example diagram
Markus Kottlaender <markus@intevation.de>
parents:
diff changeset
263 };