Click event on clicking on the graph

问题:

I have a series of line graph plotted with highcharts and the tooltip is shared among them.

http://jsfiddle.net/FhF3A/

 $('#container').highcharts({
        tooltip: {
            shared: true
        },
        series: [{
            name: 'Berlin',
            data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
        }, {
            name: 'London',
            data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
        }]
    });

What should be the best way to capture the dblclick event and obtain the hover y axis value on the graph ?

回答1:

This is explained fairly well in the documentation.

What you can do is something similar to THIS.

So you have to add something like this to your code:

chart: {
            events: {
                click: function(event) {
                    alert (
                    'x: '+ Highcharts.dateFormat('%Y-%m-%d', event.xAxis[0].value) +', ' +
                    'y: '+ event.yAxis[0].value
                    );
                }
            }
        }

Here is an example of that implementation.

Update

To ensure clicking on the graph itself is also enabled, add the following:

plotOptions: {
    series: {
         cursor: 'pointer',
         point: {
             events: {
                click: function() {
                    alert ('Category: '+ this.category +', value: '+ this.y);
                }
            }
        }
    }
},

You can see a working example HERE

回答2:

if you want to do a single click to a line, you can do so by setting plotOptions > line as in http://api.highcharts.com/highcharts#plotOptions.line.events.click.

Now if you want a double click you may have a global variable, which keep track of number of clicks within the same click event.

hope helps