comparison client/src/components/fairway/AvailableFairwayDepth.vue @ 3213:b3a1ecdda797

available_fairway_depth: hours in days
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 09 May 2019 10:52:54 +0200
parents 66e90b48387a
children ee6a4e8af766
comparison
equal deleted inserted replaced
3212:f87fd173f750 3213:b3a1ecdda797
30 import debounce from "debounce"; 30 import debounce from "debounce";
31 import { diagram } from "@/lib/mixins"; 31 import { diagram } from "@/lib/mixins";
32 import { mapState } from "vuex"; 32 import { mapState } from "vuex";
33 import filters from "@/lib/filters.js"; 33 import filters from "@/lib/filters.js";
34 34
35 const hoursInDays = x => x / 24;
36
35 export default { 37 export default {
36 mixins: [diagram], 38 mixins: [diagram],
37 data() { 39 data() {
38 return { 40 return {
39 containerId: "availablefairwaydepth", 41 containerId: "availablefairwaydepth",
136 .data(d => d.lowerLevels.reverse()) 138 .data(d => d.lowerLevels.reverse())
137 .enter() 139 .enter()
138 .append("rect") 140 .append("rect")
139 .attr("y", this.yScale(0)) 141 .attr("y", this.yScale(0))
140 .attr("height", d => { 142 .attr("height", d => {
141 return this.yScale(0) - this.yScale(d); 143 return this.yScale(0) - this.yScale(hoursInDays(d));
142 }) 144 })
143 .attr("width", this.barsWidth) 145 .attr("width", this.barsWidth)
144 .attr("fill", (d, i) => { 146 .attr("fill", (d, i) => {
145 return this.$options.COLORS.REST[i]; 147 return this.$options.COLORS.REST[i];
146 }); 148 });
147 }, 149 },
148 fnheight(name) { 150 fnheight(name) {
149 return d => this.yScale(0) - this.yScale(d[name]); 151 return d => this.yScale(0) - this.yScale(hoursInDays(d[name]));
150 }, 152 },
151 drawLDC(everyBar) { 153 drawLDC(everyBar) {
152 const height = this.fnheight("ldc"); 154 const height = this.fnheight("ldc");
153 everyBar 155 everyBar
154 .append("rect") 156 .append("rect")