Mercurial > gemma

changeset 3248:3159ee3bcb16

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
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;