Chartjs-Change Chartjs label color on click without losing hover

by

0👍

✅

You can use update method. See Updating Options. And actually vue-chartjs also use that for chartData.

On data mutation, it will call update() if the data inside the datasets has changed, or renderChart() if new datasets were added. [source]

Example code:

import { Doughnut, mixins } from "vue-chartjs";
import "chartjs-plugin-labels";

export default {
  extends: Doughnut,
  mixins: [mixins.reactiveProp],
  props: ["options"],
  watch: {
    options: {
      handler() {
        let chart = this.$data._chart;
        chart.options = this.options;
        chart.update();
      },
      deep: true
    }
  },
  mounted() {
    this.renderChart(this.chartData, this.options);
  }
};

CodeSandbox

Leave a comment