set this.left on resize (#3049)

code refactoring
nasa · May 20, 2020 · d5028ee · d5028ee
1 parent 480e327
commit d5028ee
Showing 1 changed file with 14 additions and 14 deletions.
diff --git a/src/plugins/timeConductor/ConductorAxis.vue b/src/plugins/timeConductor/ConductorAxis.vue
@@ -83,17 +83,7 @@ export default {
         }
     },
     mounted() {
-        let axisHolder = this.$refs.axisHolder;
-        this.height = axisHolder.offsetHeight;
-        this.width = axisHolder.clientWidth;
-        const rect = axisHolder.getBoundingClientRect();
-        this.left = Math.round(rect.left);
-
-        let vis = d3Selection.select(axisHolder)
-            .append("svg:svg")
-            .attr("width", "100%")
-            .attr("height", this.height);
-
+        let vis = d3Selection.select(this.$refs.axisHolder).append("svg:svg");
 
         this.xAxis = d3Axis.axisTop();
         this.dragging = false;
@@ -103,16 +93,26 @@ export default {
             .attr("class", "axis");
 
         this.setViewFromTimeSystem(this.openmct.time.timeSystem());
+        this.setAxisDimensions();
         this.setScale();
 
         //Respond to changes in conductor
         this.openmct.time.on("timeSystem", this.setViewFromTimeSystem);
         setInterval(this.resize, RESIZE_POLL_INTERVAL);
     },
-    destroyed() {
-    },
     methods: {
+        setAxisDimensions() {
+            const axisHolder = this.$refs.axisHolder;
+            const rect = axisHolder.getBoundingClientRect();
+
+            this.left = Math.round(rect.left);
+            this.width = axisHolder.clientWidth;
+        },
         setScale() {
+            if (!this.width) {
+                return;
+            }
+
             let timeSystem = this.openmct.time.timeSystem();
 
             if (timeSystem.isUTCBased) {
@@ -291,7 +291,7 @@ export default {
         },
         resize() {
             if (this.$refs.axisHolder.clientWidth !== this.width) {
-                this.width = this.$refs.axisHolder.clientWidth;
+                this.setAxisDimensions();
                 this.setScale();
             }
         }