2013-06-21 23 views
4

我正在嘗試創建一個可拖動的圓。爲什麼在d3.behavior.drag()中定義了isnt`d`

var drag = d3.behavior.drag(); 
    drag.on("drag", function(d,i) { 
     console.log(d); 
     d.x += d3.event.dx; 
     d.y += d3.event.dy; 
     //This will change the center coordinates by the delta 
     d3.select(this).attr("x", d.x).attr("y", d.y); 
     //This should change the upper left x and y values by the delta 
     d3.select(this).attr("transform", function(d,i){ 
      return "translate(" + [ x,y ] + ")" 
     }) 
    }) 

這裏是fiddle

它拋出錯誤在右邊紅圈的一舉一動,但怎麼就被說d在線路3,4不定,所以5?

回答

3

工作小提琴:http://jsfiddle.net/6a6da/33/

d,i參數通常會提到綁定的數據,但你不綁定任何數據。在你的情況下,只用事件就足夠了。

drag.on("drag", function() { 
    d3.select(this).attr("cx", +d3.select(this).attr("cx") + d3.event.dx); 
    d3.select(this).attr("cy", +d3.select(this).attr("cy") + d3.event.dy); 
})l 
0

更新時間:http://jsfiddle.net/6a6da/32/

定義dvar d = d3.event;

稍後,x和y在這裏未定義:return "translate(" + [ x,y ] + ")"。我不確定你想在那裏做什麼。

+0

任何想法,爲什麼這是?所有的例子似乎都有'd'作爲處理程序的第一個參數。 –

+0

不在文檔中:https://github.com/mbostock/d3/wiki/Drag-Behavior「」drag「:當元素被拖動時觸發.d3.event將包含」x「和」y「屬性,分別代表當前絕對拖動座標...「 –

+0

@ Joe:是的。這些文檔對於調用回調的含義非常模糊。我想知道爲什麼我能找到的所有例子都接受一個論點,它*具有*作爲早期版本或其他東西。 (這是我的+1順便說一句) –

相關問題