2

短い長さ、短い期間のドラッグ イベントをクリック イベントとして解釈する簡潔な方法はありますか? たとえば、私は d3 を使用しており、SVG でクリック、マウス移動 (ドラッグなし)、およびドラッグ イベントをキャプチャすることになっている次のイベントを定義し、そのようなイベントの終了を処理しています。

@svg
  .on("click", @plot_click )
  .on("mousemove", @plot_mousemove )
  .on("mousedown.drag", @plot_drag )
  .on("touchstart.drag", @plot_drag )

# Global event detectors
d3.select("body")      
  .on("mouseup.drag", @mouseup)
  .on("touchend.drag", @mouseup)  

ただし、マウスがまだ完全ではない短いクリック イベントは、非常に小さなドラッグ イベントとして登録されており、これは私のインターフェイスにとって非常に煩わしいものです。これを修正する良い方法は何ですか?

私は d3 を使用してイベント ハンドラーを定義していますが、これに一般的な Javascript のアプローチを採用したいと考えています。

4

1 に答える 1

1
  1. マウスダウン時に、カーソル位置をグローバル変数 (mousePosOnLastDown) に保存します。
  2. マウスアップで、カーソルが十分に移動したかどうかを確認します。
    • ある場合は、ドラッグ アクションを実行します。
    • 実行されていない場合は、クリック アクションを実行します。
    • マウスダウン カーソルの位置をクリアします。

OP からの編集: クリック アクションをまったく使用せず、マウスダウン/マウスアップ アクションのみを使用することは理にかなっています。それに応じてあなたの答えを変更しました。

于 2013-02-20T02:15:21.830 に答える