【问题标题】：Double click event on C3 chartC3图表上的双击事件
【发布时间】：2015-09-03 12:37:43
【问题描述】：

我正在使用 c3 图表，当我单击栏并双击其他内容时，我需要显示工具提示。

c3也有onclick

 data: {
              columns: [],
              onclick: function(d, i) {
                     //dosth
              },
}

找不到任何用于双击的资源。有什么想法吗？

更新： 在我的html中

  <c3-chart config="MyChart"></c3-chart>

  $scope.MyChart= {
    data: {
          columns: [],       
          type: 'bar',
        }
}

      $scope.MyChart.internal.main.selectAll('.' + c3.chart.internal.fn.CLASS.eventRect).on('dblclick', function (d) {
    var $$ = chart.internal;
    $$.main.selectAll('.' + c3.chart.internal.fn.CLASS.circle).each(function (d) {
        if ($$.isWithinShape(this, d)) {
            // event handling
            alert(d.value);
        }
    });
})

有两个问题 1. 我收到 TypeError: Cannot read property 'main' of undefined 2.怀疑这适用于栏，因为它搜索圆圈以启动双击

【问题讨论】：

标签： angularjs charts c3.js

【解决方案1】：

将双击处理程序附加到 C3 图表

chart 是您的图表对象，您可以执行类似的操作

chart.internal.main.selectAll('.' + c3.chart.internal.fn.CLASS.eventRect).on('dblclick', function (d) {
    var $$ = chart.internal;
    $$.main.selectAll('.' + c3.chart.internal.fn.CLASS.circle).each(function (d) {
        if ($$.isWithinShape(this, d)) {
            // event handling
            alert(d.value);
        }
    });
})

这基本上过滤到事件层元素（这是 c3 将其事件处理程序委托给的地方），即..CLASS.eventRect 并附加一个双击处理程序。

双击时，我们遍历所有点，即..CLASS.circle，并检查点击是否在该特定形状内。如果是，我们触发处理程序（this 是元素，d 是附加数据）

请注意，所有选择器的范围都是图表元素 (chart.internal.main)，因此当同一页面上有多个图表时，它可以正常工作。

小提琴 - http://jsfiddle.net/eo2kszt2/

【讨论】：

您似乎正在使用 c3 的指令。您可能也想发布它。