Bind on click events in NVD3.js charts
NVD3.js is a nice library for drawing fancy charts with d3.js. But it lacks some documentation and that's why some use cases are harder to implement. The following code snippet shows how you can bind on click events in a multibar chart. When a bar is clicked you get the exact data point. This should also work for other types of charts when they emit elementClick
events.
chart.multibar.dispatch.on('elementClick', function(e){
console.log('element: ' + e.value);
console.dir(e.point);
});
Written by Felix Müller
Related protips
4 Responses
Thanks, just what I was looking for!
Thanks for the feedback.
Thanks, the code above is for multiBarChart.
If you guys use the others such as discreteBarChart, you can use like this
chart.discretebar.dispatch.on('elementClick', function(e){
console.log('element: ' + e.value);
console.dir(e.point);
});
Hi
I am using this example. But while using it I am getting this error on the console.
ReferenceError: chart is not defined
Can you please tell me if I am missing something?