javascript - NVD3 调度事件不适用于 HistoricalBarChart

Question

我试图让图表点击和鼠标事件在 NVD3 历史条形图上起作用——但我没有这样做。请在此处查看 plnkr http://plnkr.co/edit/Hnyi1A ？ 我在这里看到https://github.com/krispo/angular-nvd3/issues/36他们建议使用 interactiveLayer 属性，但它似乎不起作用。可能是一个错误？

    chart: {
      type: 'historicalBarChart',

      //None of these events work 
      interactiveLayer: {
        dispatch: {
          chartClick: function(e) {
            console.log("! chart Click !")
          },
          elementClick: function(e) {
            console.log("! element Click !")
          },
          elementDblClick: function(e) {
            console.log("! element Double Click !")
          },
          elementMouseout: function(e) {
            console.log("! element Mouseout !")
          },
          elementMouseover: function(e) {
            console.log("! element Mouseover !")
          }
        }
      }
...
}

Answer 1

NVD3's LiveEdit page在扩展模式下，提供有关可用设置的所有文档。看起来您需要 bars 而不是 interactiveLayer 来获取 historicalBarChart 上的条形事件:

chart: {
  type: 'historicalBarChart',      
  bars: {
    dispatch: {          
      elementClick: function(e) {
        console.log("! element Click !")
      },
      elementDblClick: function(e) {
        console.log("! element Double Click !")
      },
      elementMouseout: function(e) {
        console.log("! element Mouseout !")
      },
      elementMouseover: function(e) {
        console.log("! element Mouseover !")
      }
    }
  }

虽然我无法让 chartClick 触发。但正如在 NVD3's own plnkr (of discreteBarChart type) 中注释掉的那样我会怀疑那里出了什么问题。