Mercurial > gemma
changeset 3248:3159ee3bcb16
client: diagram-template: improve size of pdf-container element
* calculate width,height of pdfContainer element dynamically
author | Fadi Abbud <fadi.abbud@intevation.de> |
---|---|
date | Mon, 13 May 2019 13:13:37 +0200 |
parents | 35c124338f36 |
children | d91c1200dc6b |
files | client/src/components/gauge/Waterlevel.vue |
diffstat | 1 files changed, 10 insertions(+), 1 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/components/gauge/Waterlevel.vue Mon May 13 12:42:18 2019 +0200 +++ b/client/src/components/gauge/Waterlevel.vue Mon May 13 13:13:37 2019 +0200 @@ -55,7 +55,7 @@ </div> <div id="pdfContainer" - style="position: absolute;width: 1500px; height: 400px; z-index: -1;" + style="position: absolute; z-index: -1; top: 600px;" ></div> </div> </template> @@ -319,11 +319,20 @@ addDiagram(position, offset, width, height) { let x = offset.x, y = offset.y; + // check if there are tow diagrams on screen if ( ["GAUGE_WATERLEVEL_HYDROLOGICALCONDITIONS"].indexOf(this.paneSetup) !== -1 ) { this.containerId = "pdfContainer"; + // set width and height + document.querySelector("#pdfContainer").style.width = + document.querySelector("#waterlevel-diagram-container").clientWidth * + 2 + + "px"; + document.querySelector("#pdfContainer").style.height = + document.querySelector("#waterlevel-diagram-container").clientHeight + + "px"; this.drawDiagram(); } var svg = document.getElementById(this.containerId).innerHTML;