Recovering x-axis value on click - NVD3 LineChart

Question

Is there any way to recover the x axis value on click event in the lineChart() of NVD3?

The closest I get is by this answer: nvd3.js : unable to bind onClick event with the data points in the svg

But what I want is to recover the x axis value and redirect to another page, passing it as parameter.

I tried this approach too, similar as one that I use on multiBarChart, but unsuccessful:

$("g.nv-point-paths").on("hover", function (d) {
    $("path").off("click");
    $("path").on("click", function (d) {
        //do something with 'd'
    });
});

Answer 1

I discovered it by myself, by debugging the javascript of the page:

$("g.nv-point-paths").on("hover", function (d) {
    $("g.nv-point-paths path").off("click");
    $("g.nv-point-paths path").on("click", function (d) {
        var xAxisValue = d.currentTarget.__data__.data.point[4].x;
    });
});

If someone have a better solution to this, please answer here.

Answer 2

I have been using the following:

chart.lines.dispatch.on('elementClick', function(e) { ... }

The e variable has everything you need inside of it. Just set a breakpoint and inspect the e var to see how to access whatever you want.

Example:

chart.lines.dispatch.on('elementClick', function(e) {
alert(e.point.label);
}