# HG changeset patch # User Markus Kottlaender # Date 1562941129 -7200 # Node ID ea4e1ea04e44fc397591f98fe1fe324061ca92c9 # Parent 5c896dee852bdd899f0e3770f14cf6e4fa8dbc37 client: fairway profile diagram: inlined scaleFairwayProfile method to be more in line with other diagrams diff -r 5c896dee852b -r ea4e1ea04e44 client/src/components/fairway/Fairwayprofile.vue --- 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; } } };