changeset 3915:f7f09f32d6e0

hydrological conditions: omit rendering, when container isn't visible
author Thomas Junk <thomas.junk@intevation.de>
date Thu, 11 Jul 2019 13:51:26 +0200
parents 9440d2922097
children c76bbd27f89c
files client/src/components/gauge/HydrologicalConditions.vue
diffstat 1 files changed, 7 insertions(+), 3 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/gauge/HydrologicalConditions.vue	Thu Jul 11 12:49:38 2019 +0200
+++ b/client/src/components/gauge/HydrologicalConditions.vue	Thu Jul 11 13:51:26 2019 +0200
@@ -334,12 +334,16 @@
     drawDiagram() {
       // remove old diagram
       d3.select("#" + this.containerId + " svg").remove();
-      if (!this.selectedGauge || !this.longtermWaterlevels.length) return;
+      const el = document.querySelector("#" + this.containerId);
+      if (!this.selectedGauge || !this.longtermWaterlevels.length || !el)
+        return;
+      const svgWidth = el.clientWidth;
+      const svgHeight = el.clientHeight;
       this.renderTo({
         element: `#${this.containerId}`,
         dimensions: this.getDimensions({
-          svgWidth: document.querySelector("#" + this.containerId).clientWidth,
-          svgHeight: document.querySelector("#" + this.containerId).clientHeight
+          svgWidth: svgWidth,
+          svgHeight: svgHeight
         })
       });
     },