ayanova/src/components/chart-pie-control.vue

@@ -0,0 +1,43 @@
+<script>
+import { Pie } from "vue-chartjs";
+/*
+ Bar,
+  HorizontalBar,
+  Doughnut,
+  Line,
+  Pie,
+  PolarArea,
+  Radar,
+  Bubble,
+  Scatter
+*/
+//https://vue-chartjs.org/guide/
+//https://www.chartjs.org/docs/latest/
+//https://dyclassroom.com/chartjs/how-to-create-a-pie-chart-using-chartjs
+export default {
+  extends: Pie,
+  props: {
+    chartData: {
+      type: Object,
+      default: null
+    },
+    options: {
+      type: Object,
+      default: null
+    }
+  },
+  watch: {
+    chartData() {
+      //these do nothing
+      //this.$data._chart.update();
+      //this.$data._chart.renderChart();
+
+      //this redraws the chart
+      this.renderChart(this.chartData, this.options);
+    }
+  },
+  mounted() {
+    this.renderChart(this.chartData, this.options);
+  }
+};
+</script>