✨ Add chart type Bubble

src/examples/App.vue

@@ -10,15 +10,16 @@
 </template>
 
 <script>
-  import BarExample from './examples/BarExample'
-  import LineExample from './examples/LineExample'
-  import DoughnutExample from './examples/DoughnutExample'
-  import PieExample from './examples/PieExample'
-  import RadarExample from './examples/RadarExample'
-  import PolarAreaExample from './examples/PolarAreaExample'
+  import BarExample from './BarExample'
+  import LineExample from './LineExample'
+  import DoughnutExample from './DoughnutExample'
+  import PieExample from './PieExample'
+  import RadarExample from './RadarExample'
+  import PolarAreaExample from './PolarAreaExample'
+  import BubbleExample from './BubbleExample'
 
   export default {
-    components: { BarExample, LineExample, DoughnutExample, PieExample, RadarExample, PolarAreaExample }
+    components: { BarExample, LineExample, DoughnutExample, PieExample, RadarExample, PolarAreaExample, BubbleExample }
   }
 </script>
 

src/examples/BubbleExample.js

@@ -0,0 +1,52 @@
+import BubbleChart from '../BaseCharts/Bubble'
+
+export default BubbleChart.extend({
+  mounted () {
+    this.renderChart({
+      datasets: [
+        {
+          label: 'Data One',
+          backgroundColor: '#f87979',
+          data: [
+            {
+              x: 20,
+              y: 25,
+              r: 5
+            },
+            {
+              x: 40,
+              y: 10,
+              r: 10
+            },
+            {
+              x: 30,
+              y: 22,
+              r: 30
+            }
+          ]
+        },
+        {
+          label: 'Data Two',
+          backgroundColor: '#7C8CF8',
+          data: [
+            {
+              x: 10,
+              y: 30,
+              r: 15
+            },
+            {
+              x: 20,
+              y: 20,
+              r: 10
+            },
+            {
+              x: 15,
+              y: 8,
+              r: 30
+            }
+          ]
+        }
+      ]
+    })
+  }
+})