annotate client/src/fairway/Fairwayprofile.vue @ 1021:957613a71b35

display start/end coordinates next to fairway profile
author Markus Kottlaender <markus@intevation.de>
date Wed, 24 Oct 2018 11:20:30 +0200
parents ca628dce90dd
children bf10a7f990cc
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
1 <template>
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
2 <div class="profiledisplay d-flex flex-row">
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
3 <div class="fairwayprofile">
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
4 </div>
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
5 <div class="additionalsurveys d-flex flex-column">
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
6 <small class="label">Available Additional Surveys</small>
1018
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
7 <select v-model="additionalSurvey" @change="selectAdditionalSurveyData">
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
8 <option value="">None</option>
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
9 <option v-for="survey in additionalSurveys" :key="survey.date_info">
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
10 {{survey.date_info}}
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
11 </option>
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
12 </select>
1021
957613a71b35 display start/end coordinates next to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1019
diff changeset
13 <small class="mt-2">
957613a71b35 display start/end coordinates next to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1019
diff changeset
14 <b>Start:</b><br>
957613a71b35 display start/end coordinates next to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1019
diff changeset
15 Lat: {{ startPoint[1] }}<br>
957613a71b35 display start/end coordinates next to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1019
diff changeset
16 Lon: {{ startPoint[0] }}<br>
957613a71b35 display start/end coordinates next to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1019
diff changeset
17 <b>End:</b><br>
957613a71b35 display start/end coordinates next to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1019
diff changeset
18 Lat: {{ endPoint[1] }}<br>
957613a71b35 display start/end coordinates next to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1019
diff changeset
19 Lon: {{ endPoint[0] }}<br>
957613a71b35 display start/end coordinates next to fairway profile
Markus Kottlaender <markus@intevation.de>
parents: 1019
diff changeset
20 </small>
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
21 </div>
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
22 </div>
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
23 </template>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
24
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
25 <style scoped lang="scss">
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
26 .label {
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
27 margin-bottom: $small-offset;
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
28 }
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
29 .waterlevelselection {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
30 margin-top: $large-offset;
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
31 margin-right: $large-offset;
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
32 }
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
33
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
34 .additionalsurveys {
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
35 width: 300px;
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
36 margin-top: $large-offset;
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
37 margin-bottom: auto;
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
38 margin-right: $large-offset;
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
39 margin-left: auto;
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
40 }
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
41
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
42 .additionalsurveys input {
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
43 margin-right: $small-offset;
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
44 }
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
45
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
46 .profiledisplay {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
47 width: 100vw;
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
48 }
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
49
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
50 .fairwayprofile {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
51 background-color: white;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
52 margin-left: auto;
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
53 margin-right: $offset;
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
54 margin-top: auto;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
55 margin-bottom: auto;
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
56 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
57 </style>
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
58
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
59 <script>
1019
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
60 /*
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
61 * This is Free Software under GNU Affero General Public License v >= 3.0
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
62 * without warranty, see README.md and license for details.
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
63 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
64 * SPDX-License-Identifier: AGPL-3.0-or-later
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
65 * License-Filename: LICENSES/AGPL-3.0.txt
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
66 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
67 * Copyright (C) 2018 by via donau
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
68 * – Österreichische Wasserstraßen-Gesellschaft mbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
69 * Software engineering by Intevation GmbH
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
70 *
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
71 * Author(s):
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
72 * Thomas Junk <thomas.junk@intevation.de>
ca628dce90dd Licensing information added
Thomas Junk <thomas.junk@intevation.de>
parents: 1018
diff changeset
73 */
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
74 import * as d3 from "d3";
1018
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
75 import { mapState } from "vuex";
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
76
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
77 const GROUND_COLOR = "#4A2F06";
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
78
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
79 export default {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
80 name: "fairwayprofile",
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
81 props: [
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
82 "data",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
83 "width",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
84 "height",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
85 "xScale",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
86 "yScaleLeft",
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
87 "yScaleRight",
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
88 "margin",
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
89 "totalLength",
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
90 "waterLevels",
841
07be3e5f99a9 WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 810
diff changeset
91 "fairwayCoordinates",
844
c2cba785ca4d WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 841
diff changeset
92 "selectedWaterLevel",
c2cba785ca4d WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 841
diff changeset
93 "minAlt",
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
94 "maxAlt",
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
95 "additionalSurveys"
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
96 ],
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
97 computed: {
1018
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
98 ...mapState("fairwayprofile", ["startPoint", "endPoint"]),
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
99 waterColor() {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
100 const result = this.waterLevels.find(
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
101 x => x.level === this.selectedWaterLevel
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
102 );
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
103 return result.color;
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
104 }
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
105 },
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
106 data() {
1018
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
107 return {
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
108 additionalSurvey: ""
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
109 };
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
110 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
111 watch: {
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
112 data() {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
113 this.drawDiagram();
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
114 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
115 width() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
116 this.drawDiagram();
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
117 },
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
118 height() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
119 this.drawDiagram();
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
120 },
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
121 waterLevels() {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
122 this.drawDiagram();
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
123 },
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
124 selectedWaterLevel() {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
125 this.drawDiagram();
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
126 },
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
127 fairwayCoordinates() {
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
128 this.drawDiagram();
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
129 }
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
130 },
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
131 methods: {
1018
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
132 selectAdditionalSurveyData() {
ab64c76af1b0 additional survey selection for 2nd crossprofile added
Thomas Junk <thomas.junk@intevation.de>
parents: 1015
diff changeset
133 //
1015
d2f30a784fb3 feat: add selectfield to fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 909
diff changeset
134 },
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
135 drawDiagram() {
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
136 const chartDiv = document.querySelector(".fairwayprofile");
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
137 d3.select("svg").remove();
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
138 let svg = d3.select(chartDiv).append("svg");
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
139 svg.attr("width", this.width);
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
140 svg.attr("height", this.height);
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
141 const width = this.width - this.margin.right - 1.5 * this.margin.left;
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
142 const height = this.height - this.margin.top - 2 * this.margin.bottom;
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
143 const currentData = this.data;
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
144 const {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
145 xScale,
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
146 yScaleRight,
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
147 yScaleLeft,
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
148 graph
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
149 } = this.generateCoordinates(svg, height, width);
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
150 this.drawWaterlevel({
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
151 graph,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
152 xScale,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
153 yScaleRight,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
154 height,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
155 width
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
156 });
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
157 this.drawProfile({
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
158 graph,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
159 xScale,
909
d612bc4dc3e9 profile redrawn
Thomas Junk <thomas.junk@intevation.de>
parents: 853
diff changeset
160 yScaleRight,
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
161 currentData,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
162 height,
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
163 width
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
164 });
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
165 this.drawLabels({
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
166 graph,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
167 xScale,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
168 yScaleLeft,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
169 currentData,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
170 height,
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
171 width
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
172 });
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
173 this.drawFairway({
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
174 graph,
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
175 xScale,
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
176 yScaleRight,
802
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
177 currentData,
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
178 height,
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
179 width
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
180 });
327aa4a18a1c Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 786
diff changeset
181 },
807
34b2cfcab24c Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 803
diff changeset
182 drawFairway({ graph, xScale, yScaleRight }) {
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
183 for (let coordinates of this.fairwayCoordinates) {
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
184 const [startPoint, endPoint, depth] = coordinates;
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
185 let fairwayArea = d3
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
186 .area()
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
187 .x(function(d) {
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
188 return xScale(d.x);
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
189 })
849
d63e60b868bf WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 845
diff changeset
190 .y0(yScaleRight(0))
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
191 .y1(function(d) {
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
192 return yScaleRight(d.y);
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
193 });
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
194 graph
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
195 .append("path")
849
d63e60b868bf WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 845
diff changeset
196 .datum([{ x: startPoint, y: -depth }, { x: endPoint, y: -depth }])
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
197 .attr("fill", "#002AFF")
810
68a39aea942a Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 807
diff changeset
198 .attr("stroke-opacity", 0.65)
68a39aea942a Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 807
diff changeset
199 .attr("fill-opacity", 0.65)
803
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
200 .attr("stroke", "#FFD20D")
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
201 .attr("d", fairwayArea);
30ff051e75e9 Fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 802
diff changeset
202 }
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
203 },
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
204 drawLabels({ graph, height }) {
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
205 graph
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
206 .append("text")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
207 .attr("transform", ["rotate(-90)"])
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
208 .attr("y", this.width - 60)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
209 .attr("x", -(this.height - this.margin.top - this.margin.bottom) / 2)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
210 .attr("dy", "1em")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
211 .attr("fill", "black")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
212 .style("text-anchor", "middle")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
213 .text("Depth [m]");
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
214 graph
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
215 .append("text")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
216 .attr("y", 0 - this.margin.left)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
217 .attr("x", 0 - height / 4)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
218 .attr("dy", "1em")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
219 .attr("fill", "black")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
220 .style("text-anchor", "middle")
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
221 .attr("transform", [
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
222 "translate(" + this.width / 2 + "," + this.height + ")",
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
223 "rotate(0)"
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
224 ])
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
225 .text("Width [m]");
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
226 },
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
227 generateCoordinates(svg, height, width) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
228 let xScale = d3
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
229 .scaleLinear()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
230 .domain(this.xScale)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
231 .rangeRound([0, width]);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
232
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
233 xScale.ticks(5);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
234 let yScaleLeft = d3
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
235 .scaleLinear()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
236 .domain(this.yScaleLeft)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
237 .rangeRound([height, 0]);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
238
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
239 let yScaleRight = d3
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
240 .scaleLinear()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
241 .domain(this.yScaleRight)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
242 .rangeRound([height, 0]);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
243
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
244 let xAxis = d3.axisBottom(xScale);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
245 let yAxis2 = d3.axisRight(yScaleRight);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
246 let graph = svg
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
247 .append("g")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
248 .attr(
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
249 "transform",
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
250 "translate(" + this.margin.left + "," + this.margin.top + ")"
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
251 );
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
252 graph
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
253 .append("g")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
254 .attr("transform", "translate(0," + height + ")")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
255 .call(xAxis.ticks(5));
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
256 graph
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
257 .append("g")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
258 .attr("transform", "translate(" + width + ",0)")
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
259 .call(yAxis2);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
260 return { xScale, yScaleLeft, yScaleRight, graph };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
261 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
262 drawWaterlevel({ graph, xScale, yScaleRight, height }) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
263 let waterArea = d3
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
264 .area()
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
265 .x(function(d) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
266 return xScale(d.x);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
267 })
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
268 .y0(height)
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
269 .y1(function(d) {
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
270 return yScaleRight(d.y);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
271 });
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
272 graph
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
273 .append("path")
844
c2cba785ca4d WIP Fairwayprofile
Thomas Junk <thomas.junk@intevation.de>
parents: 841
diff changeset
274 .datum([{ x: 0, y: 0 }, { x: this.totalLength, y: 0 }])
786
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
275 .attr("fill", this.waterColor)
1bee00039973 fairway profile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 780
diff changeset
276 .attr("stroke", this.waterColor)
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
277 .attr("d", waterArea);
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
278 },
909
d612bc4dc3e9 profile redrawn
Thomas Junk <thomas.junk@intevation.de>
parents: 853
diff changeset
279 drawProfile({ graph, xScale, yScaleRight, currentData, height }) {
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
280 for (let part of currentData) {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
281 let profileLine = d3
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
282 .line()
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
283 .x(d => {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
284 return xScale(d.x);
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
285 })
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
286 .y(d => {
909
d612bc4dc3e9 profile redrawn
Thomas Junk <thomas.junk@intevation.de>
parents: 853
diff changeset
287 return yScaleRight(-d.y);
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
288 });
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
289 let profileArea = d3
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
290 .area()
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
291 .x(function(d) {
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
292 return xScale(d.x);
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
293 })
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
294 .y0(height)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
295 .y1(function(d) {
909
d612bc4dc3e9 profile redrawn
Thomas Junk <thomas.junk@intevation.de>
parents: 853
diff changeset
296 return yScaleRight(-d.y);
780
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
297 });
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
298 graph
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
299 .append("path")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
300 .datum(part)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
301 .attr("fill", GROUND_COLOR)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
302 .attr("stroke", GROUND_COLOR)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
303 .attr("stroke-width", 3)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
304 .attr("d", profileArea);
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
305 graph
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
306 .append("path")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
307 .datum(part)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
308 .attr("fill", "none")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
309 .attr("stroke", "black")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
310 .attr("stroke-linejoin", "round")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
311 .attr("stroke-linecap", "round")
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
312 .attr("stroke-width", 3)
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
313 .attr("d", profileLine);
c98f88ac08a4 Fairwayprofile WIP
Thomas Junk <thomas.junk@intevation.de>
parents: 646
diff changeset
314 }
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
315 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
316 },
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
317 mounted() {
646
4450f2ab41e0 refac: Fairwawprofile view adapted
Thomas Junk <thomas.junk@intevation.de>
parents: 593
diff changeset
318 this.drawDiagram();
585
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
319 }
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
320 };
ef307bd6b5d8 refac: restructured client application
Thomas Junk <thomas.junk@intevation.de>
parents:
diff changeset
321 </script>