Question

I have an area Highchart chart.
Added a click event to the chart, like this:

plotOptions: {
                area: {
                    marker: {
                        enabled: false
                    },
                    cursor: 'Pointer',
                    stacking: 'normal',
                    events: {
                        click: function(event) {
                          alert("hi there");
                        }
                    }                   
                }
            }

It works fine. The problem is that you can only click very near to a line, but not on the area below the line, it is not clickable.

Is there a setting that I overlooked?

Answer 1

Actually, you can do exactly what you want out of the box. The chosen answer was only looking at events for the PlotOptions object; you need to look at events for the Chart object.

Documentation and example at:
http://www.highcharts.com/ref/#chart-events–click

When you click on the background, it fires the event.

chart: {
        renderTo: 'container',
        events: {
            click: function(event) {
                alert ('x: '+ event.xAxis[0].value +', y: '+
                      event.yAxis[0].value);
            }
        }        
    },