3

d3.js フォース レイアウトでドラッグを有効にしたい。円をドラッグしてマウス ボタンを離すと、次のように、コールバックを介して特定の関数を呼び出したいとします。

this.force = d3.layout.force()
    .nodes(this.nodes)
    .size([this.width, this.height]);

// enable dragging
this.circle
    .call(this.force.drag)
    .on("dragend", function() {
        console.log("You should see this, when releasing a circle.");
    })
    .on("mouseup.drag",function(d,i) {
        console.log("Or see this.");
    });

残念ながら、イベントは force.drag ハンドラーによって完全に起動/消費されることはありません。では、ドラッグの最後に d3 force レイアウトで特定のコールバック関数を実行するにはどうすればよいでしょうか?

4

1 に答える 1

3

"dragend"ここでイベントを呼び出していませんthis.force.drag。これは、定義方法にも依存しますthis.force.drag。

これはあなたのために働くはずです

myCustomDrag = d3.behavior.drag()
    .on("dragstart", function(d,i){
        //do something when drag has just started
    })
    .on("drag", function(d,i){
        //do something while dragging
    })
    .on("dragend", function(d,i){
        //do something just after drag has ended
    });

上記のコードでは、call(myCustomDrag)このドラッグ動作を表示する要素 (ここでは円) で使用するだけです。

于 2013-04-05T09:45:24.093 に答える