Mercurial > gemma
changeset 3968:ea4e1ea04e44 diagram-cleanup
client: fairway profile diagram: inlined scaleFairwayProfile method to be more in line with other diagrams
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Fri, 12 Jul 2019 16:18:49 +0200 |
parents | 5c896dee852b |
children | e0751da6272c |
files | client/src/components/fairway/Fairwayprofile.vue |
diffstat | 1 files changed, 8 insertions(+), 18 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/fairway/Fairwayprofile.vue Fri Jul 12 15:53:20 2019 +0200 +++ b/client/src/components/fairway/Fairwayprofile.vue Fri Jul 12 16:18:49 2019 +0200 @@ -156,9 +156,7 @@ mixins: [diagram, pdfgen, templateLoader], data() { return { - containerId: "fairwayprofile-diagram-container", - width: null, - height: null + containerId: "fairwayprofile-diagram-container" }; }, computed: { @@ -327,15 +325,17 @@ }; }, drawDiagram() { + // remove old diagram and exit if necessary data is missing d3.select("#" + this.containerId + " svg").remove(); - this.scaleFairwayProfile(); - if (!this.height || !this.width) return; // do not try to render when height and width are unknown - const layout = this.getPrintLayout(this.height); + const elem = document.querySelector("#" + this.containerId); + const svgWidth = elem.clientWidth; + const svgHeight = elem.clientHeight; + const layout = this.getPrintLayout(); this.renderTo({ element: "#" + this.containerId, dimensions: this.getDimensions({ - svgWidth: this.width, - svgHeight: this.height, + svgWidth: svgWidth, + svgHeight: svgHeight, ...layout }) }); @@ -607,16 +607,6 @@ .attr("fill-opacity", 0) .attr("d", profileLine); } - }, - scaleFairwayProfile() { - if (!document.querySelector("#" + this.containerId)) return; - const clientHeight = document.querySelector("#" + this.containerId) - .clientHeight; - const clientWidth = document.querySelector("#" + this.containerId) - .clientWidth; - if (!clientHeight || !clientWidth) return; - this.height = clientHeight; - this.width = clientWidth; } } };