【D3.js】トランジション終了時にコールバックを呼ぶ
D3を使って要素を移動したりスタイルを変化させる際、変更(Transition)の終了を待ってなにがしかの処理を行いたい時があります。そんな時に使えるTIPS.
Mike Bostock Solution
トランジション終了時にコールバックを実行するヘルパー関数を作成することで実現できるそうです。
参照：
https://groups.google.com/forum/#!msg/d3-js/WC_7Xi6VV50/j1HK0vIWI-EJ
|
1 2 3 4 5 6 7 8 9 10 11 12 |
//ヘルパー関数 function endall(transition, callback) { var n = 0; transition .each(function() { ++n; }) .each("end", function() { if (!--n) callback.apply(this, arguments); }); }; //callメソッドでendall関数と終了時に実行するコールバックを適用する d3.selectAll("g").transition().call(endall, function() { console.log("all done"); }); |
