Accepted answer

If you want to add an event listener after the chart is already created, the documentation provides some insight regarding extending highcharts:

Events can be added to the instance through framework event binding. If your framework is jQuery, you can for example run $(chart).bind('load', someFunction);

There is even some mention in the "Hooking up to Chart.init" section (on the same page) as to how you might bind an event after the chart has rendered, but it is a more invasive solution. I've adapted the code sample below with some modifications:

// General, global event listener
var globalCallback = function (chart) {

    // Specific event listener
    Highcharts.addEvent(chart.container, 'click', function (e) {
        e = chart.pointer.normalize();
        console.log('Clicked chart at ' + e.chartX + ', ' + e.chartY );

    // Specific event listener
    Highcharts.addEvent(chart.xAxis[0], 'afterSetExtremes', function (e) {
        console.log('Set extremes to ' + e.min + ', ' + e.max);

// Add `globalCallback` to the list of highcharts callbacks

You can also take a look at their example JSFiddle for this scenario.

Related Query

More Query from same tag