changeset 3179:6ddd3755350c

client: fix the rendering of diagram on pdf by splitscreen case (waterlevels) * draw the full diagram on pdf if two diagrams are schown on the screen
author Fadi Abbud <fadi.abbud@intevation.de>
date Tue, 07 May 2019 13:08:03 +0200
parents 5ec34e08b01d
children 429e28295902
files client/src/components/gauge/Waterlevel.vue
diffstat 1 files changed, 13 insertions(+), 1 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/gauge/Waterlevel.vue	Tue May 07 12:59:24 2019 +0200
+++ b/client/src/components/gauge/Waterlevel.vue	Tue May 07 13:08:03 2019 +0200
@@ -53,6 +53,10 @@
         </div>
       </div>
     </div>
+    <div
+      id="pdfContainer"
+      style="position: absolute;width: 1500px; height: 400px; z-index: -1;"
+    ></div>
   </div>
 </template>
 
@@ -195,7 +199,7 @@
       this.pdf.doc = new jsPDF("l", "mm", this.form.paperSize);
       this.pdf.width = this.form.paperSize === "a3" ? 420 : 297;
       this.pdf.height = this.form.paperSize === "a3" ? 297 : 210;
-      // check the template element
+      // check the template elements
       if (this.templateData) {
         let defaultFontSize = 11,
           defaultColor = "black",
@@ -314,10 +318,18 @@
     addDiagram(position, offset, width, height) {
       let x = offset.x,
         y = offset.y;
+      if (
+        ["GAUGE_WATERLEVEL_HYDROLOGICALCONDITIONS"].indexOf(this.paneSetup) !==
+        -1
+      ) {
+        this.containerId = "pdfContainer";
+        this.drawDiagram();
+      }
       var svg = document.getElementById(this.containerId).innerHTML;
       if (svg) {
         svg = svg.replace(/\r?\n|\r/g, "").trim();
       }
+      this.containerId = "waterlevel-diagram-container";
       var canvas = document.createElement("canvas");
       canvas.width = window.innerWidth;
       canvas.height = window.innerHeight / 2;