双击c3js折线图

Question

I'm trying to create a double-click event on a c3js line chart. I've created double-click events with other kinds of charts with the following code:

    chart.internal.main.selectAll('.' + c3.chart.internal.fn.CLASS.eventRect).on('dblclick', function (d) {
    var $$ = chart.internal;
    $$.main.selectAll('.' + c3.chart.internal.fn.CLASS.bar).each(function (d) {
        if ($$.isWithinShape(this, d)) {

         ...

        }
    });

But when I try this on a line chart (changing c3.chart.internal.fn.CLASS.bar to c3.chart.internal.fn.CLASS.line ) it catches all the lines in the chart, and gives no information on where on the X-axis I'm clicking. I looked through all the other values under CLASS but can't find anything that might correspond to the dots that separate the line segments.

Answer 1

I figured it out. I need to use c3.chart.internal.fn.CLASS.circle . That will tell me which datapoint is being clicked on.

I haven't tried this with circles turned off. It might not work then.