2013-03-19 104 views
0

我正在學習D3拖動,而我在這裏卡在這裏d3.event.dx。當我在控制檯輸出這個值時,它會返回一些int值,因爲我拖動了這個點,我不知道這個返回值遵循了什麼樣的模式。誰能解釋一下?d3.event.dx返回什麼?

vis.selectAll("circle.control") 
    .data(function(d) { return points.slice(0, d) }) // array contains 2 3 ... 5 points respectively 
    .enter().append("circle") 
    .attr("class", "control") 
    .attr("r", 7) 
    .attr("cx", x) 
    .attr("cy", y) 
    .call(d3.behavior.drag() 
     .on("dragstart", function(d) { 
     this.__origin__ = [d.x, d.y]; 
     //alert(this.__origin__); 
     }) 
     .on("drag", function(d) { 
     d.x = Math.min(w, Math.max(0, this.__origin__[0] += d3.event.dx)); 
     //alert(this.__origin__[0]); 
     //alert(d3.event.dx); 
     console.log(d3.event.dx); 
     // console.log (d.x); 

     d.y = Math.min(h, Math.max(0, this.__origin__[1] += d3.event.dy)); 

     //alert(this.__origin__[1]); 
     bezier = {}; 
     update(); 
     vis.selectAll("circle.control") 
      .attr("cx", x) 
      .attr("cy", y); 
     }) 
     .on("dragend", function() { 
     delete this.__origin__; 
     })); 

回答

1

dx事件對象的成員將是一些座標,但可能不是對您有意義的東西。 d3.eventDOM event,因此包含的信息可能不會反映出您在可視化中所做的操作。

您可以使用d3提供的其他方法獲取更有意義的信息,例如, d3.mouse()獲取相對於容器的座標。 documentation中的更多信息。

+0

怎麼樣?DX – Jolin 2013-03-19 12:29:06

+0

對不起,我的意思是'dx'。我會更新答案。 – 2013-03-19 13:42:00