2014-03-06 19 views
1

我想用我的運動控制器控制一個平行座標圖表(parcoords.js from D3js framework)。如何使用d3js和leapjs的拖動行爲

在parcoords.js文件

所以是一拖功能,使用標準d3js拖動行爲,支持觸摸和鼠標,描述如下:https://github.com/mbostock/d3/wiki/Drag-Behavior#wiki-drag

但我努力實現由飛躍運動的畢業生手勢單獨拖動軸。解決這個問題我需要映射飛躍座標來通過javascript來控制鼠標。另一種解決方案可能是在我的javascript檢測到抓取時調用可重新排序的函數。但我不知道如何使用閏指座標來處理d3js拖動行爲。

我希望任何人有一個想法來解決這個問題。

的d3js平行座標可以在這裏找到的一個演示:http://3developers.de/parcoords/

還有一個紅色的方形,以顯示你飛躍手指位置。

此致盧卡斯

回答

1

的主要問題是,你需要定義什麼是「拖曳手勢」是。以下是一些選項:

  • 任何手指(「指針」)移動。因此,只要控制器檢測到手指,拖動就會開始,並由手指的移動來定義。當手指離開控制器可以檢測到的區域時,停止拖動。
  • A gesture開始拖動。這可能是例如「輕敲屏幕」手勢。拖動隨後跟隨相應手指的移動並且當手勢重複時停止。

您可以通過要求手指立即位於相應元素的上方來進一步限制何時開始拖動。

在任何情況下,D3不提供對跳躍動作的直接支持,因此您必須手動觸發dragstart,drag和dragend事件。

+0

感謝您的回答,但我遇到的問題是,使用我獲得的跳躍數據,我可以創建一個虛擬指針,就像鼠標一樣,但無法單擊任何內容或使按下的鼠標在我的可視化中拖動這樣的軸。所以我不知道如何將我的跳躍位置轉變爲單個觸摸或拖動事件。也許我的擔憂現在更清晰一些。 – lrecknagel

+0

沒有真正的點擊概念。要做一個「點擊」,你可以使用我列出的選項之一。 –

+0

我現在已經找到了你的答案,我認爲這與我想要的相同。但是我不能看到將我的2D LeapPointer數組座標傳遞給d3.js中的平行座標的拖曳函數的可能性。這裏是我在評論中提到的帖子:http://stackoverflow.com/questions/18798672/is-it-possible-to-use-non-mouse-non-touch-events-to-interact-with- a-d3-js-graph – lrecknagel