improve multi Y init timing

predixdesignsystem · Mar 13, 2017 · 412e00f · 412e00f
1 parent d1fb91d
commit 412e00f
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 26 deletions.
diff --git a/dev.html b/dev.html
@@ -346,10 +346,11 @@ <h2>Example of a timeseries with a custom series configuration</h2>
         <br />
         <br />
         <h2>Example of a timeseries with a additional d3 rectangle drawn on top</h2>
+         <div style="width: 800px; height:800px; background-color: salmon">
          <px-vis-timeseries
           id="chartCustom"
-          height="500"
-          width="800"
+          height="300"
+          width="400"
           prevent-resize
           register-config='{
             "width": 250
@@ -363,6 +364,7 @@ <h2>Example of a timeseries with a additional d3 rectangle drawn on top</h2>
             "title": "Temperature"
           }'
           ></px-vis-timeseries>
+          </div>
     </template>
     <script>
       window.addEventListener('WebComponentsReady', function() {

diff --git a/dev_add.html b/dev_add.html
diff --git a/px-vis-timeseries.html b/px-vis-timeseries.html
@@ -526,12 +526,10 @@
         value: { top: 5, right: 5, bottom: 5, left: 5},
       },
       _internalMargin: {
-        type: Object,
-        notify: true
+        type: Object
       },
       _internalMarginNav: {
-        type:Object,
-        notify: true
+        type:Object
       },
       /**
        * Configuration object for the chart. Key is the property name.
@@ -616,7 +614,8 @@
       '_registerConfigChanged(registerConfig.*)',
       '_toolbarConfigChanged(toolbarConfig.*)',
 
-      '_calcAxes(completeSeriesConfig.*, leftAxisSize, rightAxisSize)',
+      '_calcAxes(completeSeriesConfig.*)',
+      '_calcAxes(leftAxisSize, rightAxisSize)',
       '_calcMargins(margin.*, marginNav.*, numRightAxes, numLeftAxes)',
       '_setXScale(width, _internalMargin, xAxisType)',
       '_setMultiYScale(height, _internalMargin, axes.*)',
@@ -645,7 +644,6 @@
       if(this.xAxisType !== 'time' && this.xAxisType !== 'timeLocal') { this.set('xAxisType', 'time'); }
       if(!this.yAxisType) { this.set('yAxisType', 'linear'); }
 
-      this._calcMargins();
       this._isReady = true;
     },
 
@@ -705,6 +703,7 @@
      */
     _calcMargins:function() {
       this.debounce('_calcMargin', function() {
+
         var margin,
             marginNav,
             topMargin = 25,