> [Wiki](Home) ? [[API--中文手冊]] ? [[行為]] ? **拖動** * 如發現翻譯不當或有其他問題可以通過以下方式聯系譯者: * 郵箱：zhang_tianxu@sina.com * QQ群：[D3數據可視化](http://jq.qq.com/?_wv=1027&k=ZGcqYF)205076374，[大數據可視化](http://jq.qq.com/?_wv=1027&k=S8wGMe)436442115 該行為會自動創建事件監聽器來處理元素的拖動，可支持鼠標事件和觸摸事件。 # d3.behavior.drag() 構造一個新的拖拽行為； # drag.on(type[, listener]) 注冊指定的監聽器listener 來接收拖動行為中指定類型type的事件；如果監聽器listener 未指定，則為指定的類型type的事件返回當前已注冊的監聽器（事件類型可能包含命名空間，查看詳細參見： dispatch.on），可支持的事件類型包括： dragstart - 拖動開始時； drag - 拖動移動時； dragend - 拖動結束時（放下時）； 拖動事件（除了dragstart 和dragend）使用x和y屬性來表示本地坐標系中拖動行為當前位置；默認情況下，這個位置即是鼠標（或觸摸）的位置，然而，這個位置可以通過指定一個原點修改；拖動事件同時也提供dx和dy屬性來表示鼠標的“瞬時”偏移量（相對于上一時刻的偏移：正數或負數），這兩個屬性有時比指定一個明確地原點更方便。 在拖動的動作中，一些瀏覽器的默認動作會自動被阻止（如：選擇文本），另外，點擊事件的默認行為隨即變成一個非空拖動動作也會被禁止，以便允許鏈接的拖動。當在可拖動元素中注冊了點擊事件，你可以這樣來檢查click事件是否被禁止： selection.on("click", function() { if (d3.event.defaultPrevented) return; // click suppressed console.log("clicked!"); }); 當拖拽事件結合其他事件一起使用時，你可以考慮阻止源事件，來避免多個動作的發生： drag.on("dragstart", function() { d3.event.sourceEvent.stopPropagation(); // silence other listeners }); # drag.origin([origin]) 如果指定了原點origin ，設置原點訪問器為指定的函數；如果未指定原點origin ，則返回當前原點訪問器，原點默認為null； 原點訪問器函數被用來確定拖拽開始時的起始位置，這就允許拖拽行為保存鼠標位置相對于開始元素位置的偏移量；如果原點訪問器為空，元素位置被設置為鼠標位置時可能會有明顯的跳動；如果指定了原點訪問器，該函數會在鼠標被按下時調用，該函數會像其他函數調用方式一樣被調用，即：會傳遞當前元素的數據d和元素索引i，還有this上下文代表當前點擊的DOM元素；要訪問當前發生的事件，可以使用d3.event；指定的原點訪問器必須返回一個包含被拖動元素開始坐標x和y的對象； 原點訪問器常常指定為恒等函數：function(d) { return d; }，當前元素已綁定了一個包含坐標位置x和y的對象時是最合適的，詳細參見： http://bl.ocks.org/1557377。 * 魏飛T20141125 * guluP20141208 2014-12-8 21:53:51