Mercurial > gemma

comparison client/src/components/map/Main.vue @ 1372:553aadd97087

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
new cross profile workflow (WIP) Needs fixing of some bugs and not so nice looks.
author Markus Kottlaender <markus@intevation.de>
date Tue, 27 Nov 2018 12:59:26 +0100
parents ca33ad696594
children b350b0b5cb6c
comparison
equal deleted inserted replaced
1371:5b9b8eabcd01 1372:553aadd97087
1 <template> 1 <template>
2 <div class="main d-flex flex-column"> 2 <div class="main d-flex flex-column">
3 <Maplayer :split="showSplitscreen"></Maplayer> 3 <Maplayer :split="showSplitscreen"></Maplayer>
4 <FairwayProfile 4 <FairwayProfile
5 :additionalSurveys="additionalSurveys"
6 :xScale="xAxis" 5 :xScale="xAxis"
7 :yScaleLeft="yAxisLeft" 6 :yScaleLeft="yAxisLeft"
8 :yScaleRight="yAxisRight" 7 :yScaleRight="yAxisRight"
9 :margin="margins"
10 ></FairwayProfile> 8 ></FairwayProfile>
11 </div> 9 </div>
12 </template> 10 </template>
13 11
14 <script> 12 <script>
34 name: "mainview", 32 name: "mainview",
35 components: { 33 components: {
36 Maplayer, 34 Maplayer,
37 FairwayProfile 35 FairwayProfile
38 }, 36 },
39 data() {
40 return {
41 width: null,
42 height: null,
43 margin: {
44 top: 20,
45 right: 40,
46 bottom: 30,
47 left: 40
48 }
49 };
50 },
51 computed: { 37 computed: {
52 ...mapState("application", ["showSplitscreen"]), 38 ...mapState("application", ["showSplitscreen"]),
53 ...mapState("fairwayprofile", [ 39 ...mapState("fairwayprofile", [
54 "currentProfile",
55 "minAlt", 40 "minAlt",
56 "maxAlt", 41 "maxAlt",
57 "totalLength", 42 "totalLength",
58 "waterLevels",
59 "fairwayCoordinates",
60 "selectedWaterLevel" 43 "selectedWaterLevel"
61 ]), 44 ]),
62 ...mapState("bottlenecks", ["surveys", "selectedSurvey"]), 45 ...mapState("bottlenecks", ["surveys", "selectedSurvey"]),
63 additionalSurveys() {
64 if (!this.surveys) return [];
65 if (!this.selectedSurvey) return this.surveys;
66 return this.surveys.filter(survey => {
67 return survey.date_info !== this.selectedSurvey.date_info;
68 });
69 },
70 xAxis() { 46 xAxis() {
71 return [this.xScale.x, this.xScale.y]; 47 return [this.xScale.x, this.xScale.y];
72 }, 48 },
73 yAxisLeft() { 49 yAxisLeft() {
74 const hi = Math.max(this.maxAlt, this.selectedWaterLevel); 50 const hi = Math.max(this.maxAlt, this.selectedWaterLevel);
75 return [this.yScaleLeft.lo, hi]; 51 return [this.yScaleLeft.lo, hi];
76 }, 52 },
77 yAxisRight() { 53 yAxisRight() {
78 const DELTA = this.maxAlt * 1.1 - this.maxAlt; 54 const DELTA = this.maxAlt * 1.1 - this.maxAlt;
79 return [this.maxAlt * 1 + DELTA, -DELTA]; 55 return [this.maxAlt * 1 + DELTA, -DELTA];
80 },
81 margins() {
82 return this.margin;
83 }, 56 },
84 yScaleLeft() { 57 yScaleLeft() {
85 return { 58 return {
86 lo: this.minAlt, 59 lo: this.minAlt,
87 hi: this.maxAlt 60 hi: this.maxAlt