comparison client/src/components/fairway/AvailableFairwayDepthLNWL.vue @ 3368:70605404f37d

fa_lnwl: prototypical diagram added
author Thomas Junk <thomas.junk@intevation.de>
date Wed, 22 May 2019 11:00:25 +0200
parents 8974efd71917
children ccb5455f0713
comparison
equal deleted inserted replaced
3367:ecb4baa2be1a 3368:70605404f37d
419 .attr("height", this.dimensions.mainHeight); 419 .attr("height", this.dimensions.mainHeight);
420 this.diagram = diagram 420 this.diagram = diagram
421 .append("g") 421 .append("g")
422 .attr("transform", `translate(0 ${this.paddingTop})`); 422 .attr("transform", `translate(0 ${this.paddingTop})`);
423 }, 423 },
424 drawBars() {}, 424 drawBars() {
425 this.drawLNWL();
426 },
427 drawLNWL() {
428 let lnwl = this.diagram
429 .append("g")
430 .attr("transform", `translate(${this.paddingRight})`);
431 lnwl
432 .selectAll("rect")
433 .data(this.fwLNWLData.lnwl)
434 .enter()
435 .append("rect")
436 .attr("height", d => {
437 return this.yScale(0) - this.yScale(d.percent);
438 })
439 .attr("y", d => {
440 return this.yScale(d.translateY);
441 })
442 .attr("width", this.barsWidth)
443 .attr("fill", d => {
444 if (d.level === "LDC") return "#aaaaaa";
445 return "#3333cc";
446 });
447 },
425 drawScaleLabel() { 448 drawScaleLabel() {
426 const center = this.dimensions.mainHeight / 2; 449 const center = this.dimensions.mainHeight / 2;
427 this.diagram 450 this.diagram
428 .append("text") 451 .append("text")
429 .text(this.$options.LEGEND) 452 .text(this.$options.LEGEND)