Chart.js not getting value from selected bars

i am not able to get value from selected bar in chart.js bar chart please help me My view like this <canvas id="myChart" width="400" height="400" click="onClick"></canvas> my click event code like this $("#myChart").click(function(e) { var activeBars = myBarChart.getBarsAtEvent(evt); var activeBars = myBarChart.getBarsAtEvent(e); console.log(activeBars.getBarsAtEvent()); });
2 answers

Hi Denil,

Not real sure what you are doing here. Are these code snippets from some sort of edit you made in the Chartjs widget?

The code seems a bit strange, to say the least.

  • The canvas has an onclick and you are registering a different click event using jquery in the snippet.
  • Declaring activeBars twice doesn't really do much, you are also overwriting the value
  • The first activeBars tries to use 'evt', which is seems to be 'undefined'
  • You try to call getBarsAtEvent without an event and also on a variable which is already the resulting output of that same function.

Fixing these issues should get you a long way there.


If the parameter of the click function is e the evt does not exist here.

If you connect the click to the chart with $("#myChart") myBarChart probably does not exists here as well.

So my shot from a distance is:

$("#myChart").click(function(e) {
   var activeBars = $("#myChart").getBarsAtEvent(e);