[Chartjs]-ChartJS doughnut legend click

by

1👍

✅

Your JSfiddle looks fine except that the newLegendClickHandler is defined at the wrong place inside options. You should define it inside legend as follows.

legend: {
  position: 'top',
  onClick: newLegendClickHandler
},

Please also check Custom On Click Actions from Chart.js
documentation

1👍

The click handler was set to the chart itself and not the legend. Move the new onClick handler inside of the legend options.

var options = {
    cutoutPercentage: 20,
  responsive: true,
  legend: {
    position: 'top',
    onClick: newLegendClickHandler,
  },
  title: {
    display: true,
    text: 'Chart.js Doughnut Chart'
  },
  animation: {
    animateScale: true,
    animateRotate: true
  }
};

Leave a comment