Question

I want to bind a function to a click event for a data point in Highcharts. Clicking a data point has to call a function, but the arguments to the function are dynamic (i.e. there are several graphs drawn, and the "car" variable is generated anew for each graph).

How to bind "getCarDate()" to click event properly? This does not work (car simply holds the last assigned value instead of a different value for each plot):

                         plotOptions: {
                            series: {
                                cursor: 'pointer',
                                point: {
                                    events: {
                                        click: function (e) {
                                            getCarDate(this.x, car)
                                        }
                                    }
                                },
                                marker: {
                                    lineWidth: 1
                                }
                            }
                        },
Was it helpful?

Solution

One trick you could use here would be to stash the value into the Highcharts options:

$('#container'+i).highcharts({

    myData: car,

    plotOptions: {
        series: {
            cursor: 'pointer',
            point:{                 
                events: {
                    click: function(event) {     
                       alert(this.series.chart.userOptions.myData);
                    }
                }
           }
        }
    },

Here's a fiddle.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top