2👍
✅
You can use the native onClick
event handler method of the legend.
So.. in your chart options, define the following :
options: {
legend: {
onClick: newLegendClickHandler
},
...
}
this will override the default on-click event handler function of the legend.
ᴅᴇᴍᴏ
var chart = new Chart(ctx, {
type: 'line',
data: {
labels: ['Jan', 'Feb', 'Mar'],
datasets: [{
label: 'LINE',
data: [3, 1, 4],
backgroundColor: 'rgba(0, 119, 290, 0.2)',
borderColor: 'rgba(0, 119, 290, 0.6)'
}]
},
options: {
legend: {
onClick: newLegendClickHandler
}
}
});
function newLegendClickHandler() {
alert('newLegendClickHandler function has been called!');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.6.0/Chart.min.js"></script>
<canvas id="ctx"></canvas>
Source:stackexchange.com