D3 - ブラシとブラシハンドルのプログラムによる制御

ブラシ（およびブラシハンドル）の動作にいくつかの制限を設定しようとしています。私はブラシ開始とブラシ終了の間に最小量を設定したいと思います。D3 - ブラシとブラシハンドルのプログラムによる制御

私はこれを開始しました：ユーザーがブラシを動かすと

。コードは、ブラシハンドルの変換属性を変更します。これは下地のブラシの位置にも影響すると思われます。

私はおそらくちょうど修正値と考えた：

d3.event.selection

が働くかもしれません。たとえば、ユーザーが150ピクセル以下でスクロールできないようにするには、次のようにコード化しました。

var s = d3.event.selection; 
if (s[0] < 150) { 
s[0] = 150; 
}

これはブラシハンドルに有効です。しかし、ブラシには影響しません。

私は、次の場所に変更MBのコードを入れている：

前進上の任意の一般的なアイデアをいただければ幸いです。

上記の修正された質問に記載されている余分な行が問題を修正するように見えました。要約すると

：

gBrush.call(brush.move, [150, s[1]]);

がに追加されました。より詳細には

var s = d3.event.selection; 
if (s[0] < 150) { 
s[0] = 150; 
gBrush.call(brush.move, [150, s[1]]); 
}

、ブラシがそれを処理フレームワークを介して、マウスから任意のデフォルトのコントロールを取得していないようだとする必要があります

handle.attr("display", null).attr("transform", function(d, i) { return "translate(" + s[i] + "," + height/2 + ")"; });

ブラシは、次の行を使用して移動する方法を説明しました。フレームワークを介してマウスからのデフォルトのコントロール。したがって、通常、ブラシハンドルは、ブラシがマウスに反応する方法を伝える必要があります。

ブラシをプログラム的に制御するなどの特別な状況です。ブラシハンドルとブラシの両方がどのように振る舞うかを伝える必要があります。構文は2つの要素で若干異なります。

Iは、所望の動作を生成する上記のスニペットに追加の行を追加しました：

var s = d3.event.selection; 
if (s[0] < 150) { 
s[0] = 150; 
gBrush.call(brush.move, [150, s[1]]); 
}

ブラシ上のコールがその新しい動作の世話をします。これは動作するよう

handle.attr("display", null).attr("transform", function(d, i) { return "translate(" + s[i] + "," + height/2 + ")"; });

：

の配列に変化は、次にブラシハンドルを変更し、それ以下のコードの行によって作用されます。

2016-10-16 02:07:05 markthekoala

答えて