Mercurial > gemma
changeset 3489:e6673f35d5d1
client: diagram-template: improve diagramlegend element (AvailableFairwayDepthLNWL)
* make values and styles of diagramlegend dynamic
* adjust positioning and size
| author | Fadi Abbud <fadi.abbud@intevation.de> |
|---|---|
| date | Mon, 27 May 2019 16:38:36 +0200 |
| parents | 1fbb6dc7d362 |
| children | 624c64670d48 |
| files | client/src/components/fairway/AvailableFairwayDepthLNWL.vue |
| diffstat | 1 files changed, 19 insertions(+), 24 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/fairway/AvailableFairwayDepthLNWL.vue Mon May 27 16:33:30 2019 +0200 +++ b/client/src/components/fairway/AvailableFairwayDepthLNWL.vue Mon May 27 16:38:36 2019 +0200 @@ -186,7 +186,7 @@ const lowerBound = [d[0], w[0]].filter(x => x).join(", "); const upperBound = [d[1], w[1]].filter(x => x).join(", "); return [ - `> LDC`, + `> LDC`, `< ${lowerBound}`, `< ${upperBound}`, `>= ${upperBound}` @@ -417,7 +417,7 @@ y = offset.y; this.pdf.doc.setFontSize(10); let width = - (this.pdf.doc.getStringUnitWidth(">= LDC [h]") * 10) / (72 / 25.6) + 15; + (this.pdf.doc.getStringUnitWidth(">= LDC") * 10) / (72 / 25.6) + 15; // if position is on the right, x needs to be calculate with pdf width and // the size of the element @@ -425,33 +425,28 @@ x = this.pdf.width - offset.x - width; } if (["bottomright", "bottomleft"].indexOf(position) !== -1) { - y = this.pdf.height - offset.y - this.getTextHeight(7); + y = this.pdf.height - offset.y - this.getTextHeight(6); } this.pdf.doc.setTextColor(color); - this.pdf.doc.setDrawColor("rgb(255, 133, 94)"); - this.pdf.doc.setFillColor("rgb(255, 133, 94)"); - this.pdf.doc.rect(x, y, 8, 4, "FD"); - this.pdf.doc.text(">= LDC [h]", x + 10, y + 3); + this.pdf.doc.setDrawColor(this.$options.LWNLCOLORS.LDC); + this.pdf.doc.setFillColor(this.$options.LWNLCOLORS.LDC); + this.pdf.doc.roundedRect(x, y, 10, 4, 1.5, 1.5, "FD"); + this.pdf.doc.text(this.legendLNWL[0], x + 12, y + 3); - this.pdf.doc.setDrawColor("rgb(255, 66, 79)"); - this.pdf.doc.setFillColor("rgb(255, 66, 79)"); - this.pdf.doc.rect(x, y + 5, 8, 4, "FD"); - this.pdf.doc.text("< 200.00 [h]", x + 10, y + 8); + this.pdf.doc.setDrawColor(this.$options.AFDCOLORS[2]); + this.pdf.doc.setFillColor(this.$options.AFDCOLORS[2]); + this.pdf.doc.roundedRect(x, y + 5, 10, 4, 1.5, 1.5, "FD"); + this.pdf.doc.text(this.legendLNWL[1], x + 12, y + 8); - this.pdf.doc.setDrawColor("rgb(255, 115, 124)"); - this.pdf.doc.setFillColor("rgb(255, 115, 124)"); - this.pdf.doc.rect(x, y + 10, 8, 4, "FD"); - this.pdf.doc.text(">= 200.00 [h]", x + 10, y + 13); + this.pdf.doc.setDrawColor(this.$options.AFDCOLORS[1]); + this.pdf.doc.setFillColor(this.$options.AFDCOLORS[1]); + this.pdf.doc.roundedRect(x, y + 10, 10, 4, 1.5, 1.5, "FD"); + this.pdf.doc.text(this.legendLNWL[2], x + 12, y + 13); - this.pdf.doc.setDrawColor("rgb(255, 153, 160)"); - this.pdf.doc.setFillColor("rgb(255, 153, 160)"); - this.pdf.doc.rect(x, y + 15, 8, 4, "FD"); - this.pdf.doc.text(">= 230.00 [h]", x + 10, y + 18); - - this.pdf.doc.setDrawColor("rgb(45, 132, 179)"); - this.pdf.doc.setFillColor("rgb(45, 132, 179)"); - this.pdf.doc.rect(x, y + 20, 8, 4, "FD"); - this.pdf.doc.text(">= 250.00 [h]", x + 10, y + 23); + this.pdf.doc.setDrawColor(this.$options.AFDCOLORS[0]); + this.pdf.doc.setFillColor(this.$options.AFDCOLORS[0]); + this.pdf.doc.roundedRect(x, y + 15, 10, 4, 1.5, 1.5, "FD"); + this.pdf.doc.text(this.legendLNWL[3], x + 12, y + 18); }, close() { this.$store.commit("application/paneSetup", "DEFAULT");