comparison client/src/components/fairway/AvailableFairwayDepth.vue @ 3128:1610d3042bbb

fairway_availability: generative code fixed
author Thomas Junk <thomas.junk@intevation.de>
date Mon, 29 Apr 2019 17:06:46 +0200
parents 383720d8d98e
children 2e36267ab50e
comparison
equal deleted inserted replaced
3127:0374197c384f 3128:1610d3042bbb
60 }, 60 },
61 drawBars({ diagram, data, yScale }) { 61 drawBars({ diagram, data, yScale }) {
62 const paddingRight = 100; 62 const paddingRight = 100;
63 const paddingTop = 30; 63 const paddingTop = 30;
64 64
65 const bars = diagram 65 const allBars = diagram
66 .selectAll("g") 66 .selectAll("g")
67 .data(data) 67 .data(data)
68 .enter() 68 .enter()
69 .append("g") 69 .append("g")
70 .attr("transform", (d, i) => { 70 .attr("transform", (d, i) => {
71 return ( 71 return "translate(" + (paddingRight + i * 95) + " 10 )";
72 "translate(" + (paddingRight + i * 60) + "," + yScale(-1) + ")"
73 );
74 }); 72 });
75 const bar = bars.append("g"); 73 const barPerMonth = allBars
76
77 bar
78 .selectAll("rect") 74 .selectAll("rect")
79 .data(d => d.values) 75 .data(d => d.values)
80 .enter() 76 .enter()
81 .append("rect") 77 .append("rect")
82 .attr("width", 30) 78 .attr("x", 0)
83 .attr("height", (d, i) => { 79 .attr("y", yScale(0))
84 console.log(d); 80 .attr("height", d => {
85 return yScale(0) - yScale(d); 81 return Math.abs(yScale(0) - yScale(d));
86 }) 82 })
87 .attr("transform", d => { 83 .attr("transform", d => {
88 return "translate(0 -" + (yScale(0) - yScale(d)) + ")"; 84 if (d > 0)
85 return "translate(0 -" + Math.abs(yScale(0) - yScale(d)) + ")";
86 return "translate(0 " + 0 + ")";
89 }) 87 })
88 .attr("width", 60)
90 .attr("fill", (d, i) => { 89 .attr("fill", (d, i) => {
91 return colors[i]; 90 return colors[i];
92 }); 91 });
93
94 bars
95 .append("text")
96 .text((d, i) => {
97 return d.month;
98 })
99 .attr("text-anchor", "middle")
100 .attr("x", 15)
101 .attr("y", 0)
102 .attr("dy", "1em");
103 }, 92 },
104 drawLabel(diagram, height) { 93 drawLabel(diagram, height) {
105 const dy = height / 2; 94 const dy = height / 2;
106 diagram 95 diagram
107 .append("text") 96 .append("text")