attach event handler to Column Chart in google charts

charts, google-visualization

Solution

Use a "click" event handler:

google.visualization.events.addListener(chart, 'click', function(e) {
    var match = e.targetID.match(/hAxis#\d#label#(\d)/);
    if (match != null && match.length) {
        var rowIndex = parseInt(match[1]);
        // get the value from column 0 in the clicked row
        var label = data.getValue(rowIndex, 0);
        alert('You clicked on ' + label);
    }
});

Problem

How to add Event Listeners to google charts(Column Chart) column name(label). For example, the lables such as 2004,2005,2006, 2007 should throw events. When the user clicks on column name(label), event(select) should be triggered. There is a provision to add event listener to the visualisation data but not to the column label. Fire an event with the name 'select' when the user selects some data within the visualization. The event does not send any arguments to the listening functions. https://developers.google.com/chart/interactive/docs/dev/events#The_Select_Event

Original source