feat(ux): Add a wrapper around generateLegend (#390)

As this is used quite often this wrapper function will improve the UX of generating a legend

Author: apertureless

docs/README.md

@@ -75,6 +75,27 @@ There are some basic props defined in the BaseCharts. Because you `extend()` the
 | chart-id | id of the canvas |
 | css-classes | String with css classes for the surrounding div |
 | styles | Object with css styles for the surrounding div container |
+| plugins | Array with chartjs plugins |
+
+## Legend Generation
+
+`vue-chartjs` provides a small helper to generate a HTML legend.
+
+```js
+import { Line } from 'vue-chartjs'
+
+export default {
+  extends: Line,
+  props: ['datasets', 'options']
+  data: () => ({
+    htmlLegend: null
+  })
+  mounted () {
+    this.renderChart(this.datasets, this.options)
+    this.htmlLegend = this.generateLegend()
+  }
+}
+```
 
 ## Examples
 

src/BaseCharts.js

@@ -62,6 +62,11 @@ export function generateChart (chartId, chartType) {
       addPlugin (plugin) {
         this.$data._plugins.push(plugin)
       },
+      generateLegend () {
+        if (this.$data._chart) {
+          return this.$data._chart.generateLegend()
+        }
+      },
       renderChart (data, options) {
         if (this.$data._chart) this.$data._chart.destroy()
         this.$data._chart = new Chart(