4

NVD3サイトで起こっているのと同じことを達成したい

1つのグラフをクリックすると、他のグラフが更新されます。

サイトの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 に答える