From 998b190007ebe917024dcab44491b8c3e1449375 Mon Sep 17 00:00:00 2001
From: Thorsten <t.luenborg@googlemail.com>
Date: Fri, 19 Aug 2016 21:30:39 +0200
Subject: [PATCH] save chart instance on vm instance and add destroy() hooks to
 properly destroy chart when component is destroyed.

---
 src/BaseCharts/Bar.js       | 7 +++++--
 src/BaseCharts/Doughnut.js  | 7 +++++--
 src/BaseCharts/Line.js      | 7 +++++--
 src/BaseCharts/Pie.js       | 7 +++++--
 src/BaseCharts/PolarArea.js | 7 +++++--
 src/BaseCharts/Radar.js     | 7 +++++--
 6 files changed, 30 insertions(+), 12 deletions(-)

diff --git a/src/BaseCharts/Bar.js b/src/BaseCharts/Bar.js
index 7f22df1..b8c7695 100644
--- a/src/BaseCharts/Bar.js
+++ b/src/BaseCharts/Bar.js
@@ -45,14 +45,17 @@ export default Vue.extend({
 
   methods: {
     render (data, options = this.options) {
-      const chart = new Chart(
+      this._chart = new Chart(
         this.$els.canvas.getContext('2d'), {
           type: 'bar',
           data: data,
           options: options
         }
       )
-      chart.generateLegend()
+      this._chart.generateLegend()
     }
+  },
+  destroy () {
+    this._chart.destroy()
   }
 })
diff --git a/src/BaseCharts/Doughnut.js b/src/BaseCharts/Doughnut.js
index 4f421d6..533b0fd 100644
--- a/src/BaseCharts/Doughnut.js
+++ b/src/BaseCharts/Doughnut.js
@@ -28,14 +28,17 @@ export default Vue.extend({
 
   methods: {
     render (data, options = this.options) {
-      const chart = new Chart(
+      this._chart = new Chart(
         this.$els.canvas.getContext('2d'), {
           type: 'doughnut',
           data: data,
           options: options
         }
       )
-      chart.generateLegend()
+      this._chart.generateLegend()
     }
+  },
+  destroy () {
+    this._chart.destroy()
   }
 })
diff --git a/src/BaseCharts/Line.js b/src/BaseCharts/Line.js
index 70cee69..174b2ef 100644
--- a/src/BaseCharts/Line.js
+++ b/src/BaseCharts/Line.js
@@ -43,14 +43,17 @@ export default Vue.extend({
 
   methods: {
     render (data, options = this.options) {
-      const chart = new Chart(
+      this._chart = new Chart(
         this.$els.canvas.getContext('2d'), {
           type: 'line',
           data: data,
           options: options
         }
       )
-      chart.generateLegend()
+      this._chart.generateLegend()
     }
+  },
+  destroy () {
+    this._chart.destroy()
   }
 })
diff --git a/src/BaseCharts/Pie.js b/src/BaseCharts/Pie.js
index 4eb89af..bb31b2a 100644
--- a/src/BaseCharts/Pie.js
+++ b/src/BaseCharts/Pie.js
@@ -28,14 +28,17 @@ export default Vue.extend({
 
   methods: {
     render (data, options = this.options) {
-      const chart = new Chart(
+      this._chart = new Chart(
         this.$els.canvas.getContext('2d'), {
           type: 'pie',
           data: data,
           options: options
         }
       )
-      chart.generateLegend()
+      this._chart.generateLegend()
     }
+  },
+  destroy () {
+    this._chart.destroy()
   }
 })
diff --git a/src/BaseCharts/PolarArea.js b/src/BaseCharts/PolarArea.js
index 1c5f8bf..dafece2 100644
--- a/src/BaseCharts/PolarArea.js
+++ b/src/BaseCharts/PolarArea.js
@@ -28,14 +28,17 @@ export default Vue.extend({
 
   methods: {
     render (data, options = this.options) {
-      const chart = new Chart(
+      this._chart = new Chart(
         this.$els.canvas.getContext('2d'), {
           type: 'polarArea',
           data: data,
           options: options
         }
       )
-      chart.generateLegend()
+      this._chart.generateLegend()
     }
+  },
+  destroy () {
+    this._chart.destroy()
   }
 })
diff --git a/src/BaseCharts/Radar.js b/src/BaseCharts/Radar.js
index a5f5eaf..2232527 100644
--- a/src/BaseCharts/Radar.js
+++ b/src/BaseCharts/Radar.js
@@ -28,14 +28,17 @@ export default Vue.extend({
 
   methods: {
     render (data, options = this.options) {
-      const chart = new Chart(
+      this._chart = new Chart(
         this.$els.canvas.getContext('2d'), {
           type: 'radar',
           data: data,
           options: options
         }
       )
-      chart.generateLegend()
+      this._chart.generateLegend()
     }
+  },
+  destroy () {
+    this._chart.destroy()
   }
 })