4

我想完成与NVD3 网站上相同的事情

当您单击一个图表时,其他图表会更新。

查看网站的 js,这就是神奇之处

chart.stacked.dispatch.on('areaClick.updateExamples', function(e) {
    setTimeout(function() {
      mainExample.update();
      exampleOne.update();
      //exampleTwo.update();
      exampleThree.update();
    }, 100);
  })

我不明白第一行中的“updatesExamples”是什么。它是一个函数,一个变量。我在代码的其他任何地方都找不到它。我已经将代码复制到我的应用程序中,但我相信这个词是让它工作的关键。

有任何想法吗?

4

1 回答 1

14

updatesExamples是一个事件命名空间。你可以添加任何你想要的字符串。这是d3.js的一个特性 在此处查看文档。

多件事可以触发事件,并且对于代码组织,您可能想要命名事件。例如,在NVD3中,如果您希望在单击图例时发生某些事情,您可以添加这样的事件处理程序

chart.legend.dispatch.on('legendClick.hi', function(e){
  console.log('legend was clicked', 'namespace:', 'hi');
});

这里,被监听的事件是legendClick,命名空间是hi。您可以添加另一个具有不同命名空间的处理程序,单击图例时也会触发该处理程序。

chart.legend.dispatch.on('legendClick.there', function(e){
  console.log('legend was clicked', 'namespace:', 'there');
});

命名空间是可选的,您可能只是将事件的名称传递给on方法。

chart.legend.dispatch.on('legendClick', function(e){
  console.log('legend was clicked', 'no namespace.');
});

您可以在此处的实时代码示例中使用它:http: //nvd3.org/livecode/#codemirrorNav

于 2012-11-22T23:51:24.000 回答