Chartjs-Execute onClick function on Custom Legend

0đź‘Ť

With beaver’s suggestion, I found a solution. I had to change the call to my function:

document.getElementById('js-legend').innerHTML = chartTurn.generateLegend().replace(/\"0-legend"/g, 'legend');
$("#js-legend > ul > li").on("click", function(event) {
  event = event || window.event;

  var target = event.target || event.srcElement;
  while (target.nodeName !== 'LI') {
    target = target.parentElement;
  }
  var parent = target.parentElement;
  var chart = Chart.instances[0];
  var index = Array.prototype.slice.call(parent.children).indexOf(target);
  console.log(chart.legend.legendItems[index]);

  Pie_onClickLegend_HighlightOnSlice(event.originalEvent, chart.legend.legendItems[index],chart);
})

And since I used “this.chart” in “Pie_onClickLegend_HighlightOnSlice”, now I have to pass also the chartInstance I want to use:

function Pie_onClickLegend_HighlightOnSlice(event, legendItem, chartInstance) {
   if (chartInstance === undefined){
       chartInstance = this.chart;
   }

   [...]
}

Leave a comment