0.9.0

Author: jtblin

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "angular-chart.js",
-  "version": "0.8.9",
+  "version": "0.9.0",
   "main": [
     "./dist/angular-chart.js",
     "./dist/angular-chart.css"

dist/angular-chart.js

@@ -137,14 +137,15 @@
           // Order of setting "watch" matter
 
           scope.$watch('data', function (newVal, oldVal) {
-            if (! newVal || ! newVal.length || (Array.isArray(newVal[0]) && ! newVal[0].length)) return;
+            if (! newVal || ! newVal.length || (Array.isArray(newVal[0]) && ! newVal[0].length)) {
+              destroyChart(chart, scope);
+              return;
+            }
             var chartType = type || scope.chartType;
             if (! chartType) return;
 
-            if (chart) {
-              if (canUpdateChart(newVal, oldVal)) return updateChart(chart, newVal, scope, elem);
-              chart.destroy();
-            }
+            if (chart && canUpdateChart(newVal, oldVal))
+              return updateChart(chart, newVal, scope, elem);
 
             createChart(chartType);
           }, true);
@@ -157,12 +158,11 @@
           scope.$watch('chartType', function (newVal, oldVal) {
             if (isEmpty(newVal)) return;
             if (angular.equals(newVal, oldVal)) return;
-            if (chart) chart.destroy();
             createChart(newVal);
           });
 
           scope.$on('$destroy', function () {
-            if (chart) chart.destroy();
+            destroyChart(chart, scope);
           });
 
           function resetChart (newVal, oldVal) {
@@ -173,8 +173,6 @@
 
             // chart.update() doesn't work for series and labels
             // so we have to re-create the chart entirely
-            if (chart) chart.destroy();
-
             createChart(chartType);
           }
 
@@ -192,6 +190,10 @@
               getDataSets(scope.labels, scope.data, scope.series || [], colours) :
               getData(scope.labels, scope.data, colours);
             var options = angular.extend({}, ChartJs.getOptions(type), scope.options);
+
+            // Destroy old chart if it exists to avoid ghost charts issue
+            // https://github.com/jtblin/angular-chart.js/issues/187
+            destroyChart(chart, scope);
             chart = new ChartJs.Chart(ctx)[type](data, options);
             scope.$emit('create', chart);
 
@@ -363,5 +365,11 @@
       var options = angular.extend({}, Chart.defaults.global, ChartJs.getOptions(type), scope.options);
       return options.responsive;
     }
+
+    function destroyChart(chart, scope) {
+      if(! chart) return;
+      chart.destroy();
+      scope.$emit('destroy', chart);
+    }
   }
 }));

dist/angular-chart.js.tar.gz

@@ -62,7 +62,7 @@ <h1>
         <p>
           <a class="btn btn-default btn-lg" href="https://github.com/jtblin/angular-chart"><i class="icon-github"></i>Code on Github</a>
           <a class="btn btn-success btn-lg" href="../dist/angular-chart.js.tar.gz" download="angular-chart.js.tar.gz">
-            <i class="fa fa-download"></i> Download <small>(0.8.9)</small>
+            <i class="fa fa-download"></i> Download <small>(0.9.0)</small>
           </a>
         </p>
       </div>

dist/angular-chart.min.js

@@ -1,6 +1,6 @@
 {
   "name": "angular-chart.js",
-  "version": "0.8.9",
+  "version": "0.9.0",
   "description": "An angular.js wrapper for Chart.js",
   "main": "dist/angular-chart.js",
   "directories": {