Fixed timeseries bug for initial rendering

rohanoid5 · rohanoid5 · commit 6260de138acf · 2018-12-27T18:58:55.000+05:30
diff --git a/example/index.html b/example/index.html
@@ -18,7 +18,13 @@
 
   <body>
     <div id="chart1">
-      <fusioncharts :options="options">
+      <fusioncharts
+        :width="width"
+        :height="height"
+        :type="pieType"
+        :dataFormat="dataFormat"
+        :dataSource="chartDs"
+      >
         FusionCharts will render here...
       </fusioncharts>
       <div v-show="displayChart">
diff --git a/example/index.js b/example/index.js
@@ -58,6 +58,16 @@ var chart = new Vue({
         }
       ]
     },
+    pieType: 'Pie2D',
+    chartDs: {
+      chart: {
+        caption: 'Vue FusionCharts Sample',
+        theme: 'fint',
+        animation: '1',
+        updateanimduration: '100'
+      },
+      data: [{ value: 1.9 }, { value: 2.3 }, { value: 2.1 }]
+    },
     options: {
       width: '500',
       height: '300',
@@ -95,9 +105,9 @@ var chart = new Vue({
   methods: {
     changeFirstChartAttr: function() {
       // let dataSource = Object.assign({}, this.pieDataSource);
-      this.options.dataSource.chart.caption = 'Changed to something else';
-      // dataSource.data[2].value = this.getRandomNumber();
-      // dataSource.data[1].value = this.getRandomNumber();
+      this.chartDs.chart.caption = 'Changed to something else';
+      this.chartDs.data[2].value = this.getRandomNumber();
+      this.chartDs.data[1].value = this.getRandomNumber();
       // this.pieDataSource = dataSource;
     },
     changeSecondChartAttr: function() {
diff --git a/src/vue-fusioncharts-component.js b/src/vue-fusioncharts-component.js
@@ -124,6 +124,7 @@ export default (FC, ...options) => {
       },
       dataSource: {
         handler: function() {
+          console.log('Called dataSource');
           if (!checkIfDataTableExists(this.dataSource)) {
             this.chartObj.setChartData(
               this.datasource || this.dataSource,
@@ -143,6 +144,24 @@ export default (FC, ...options) => {
           }
         },
         deep: true
+      },
+      'datasource.data': {
+        handler: function() {
+          this.chartObj.setChartData(
+            this.datasource || this.dataSource,
+            this.dataFormat || this.dataformat
+          );
+        },
+        deep: false
+      },
+      'dataSource.data': {
+        handler: function() {
+          this.chartObj.setChartData(
+            this.datasource || this.dataSource,
+            this.dataFormat || this.dataformat
+          );
+        },
+        deep: false
       }
     },
     deactivated: function() {
