为什么这个 D3 拖动不起作用？

Question

我是 D3 的新手，刚开始玩它。我想通过拖放移动预先创建的矩形（或圆形）。这是我的fiddle。

// Create the SVG
var svg = d3.select("body").append("svg")
  .attr("width", 700)
  .attr("height", 400);

// Add a background
svg.append("rect")
  .attr("width", 700)
  .attr("height", 400)
  .style("stroke", "#999999")
  .style("fill", "#F6F6F6")

svg.append("circle")
.attr({ cx: 50, cy: 50, r: 5, fill: "red" })
.style("cursor", "pointer")
.call(drag);

svg.append("rect")
.attr({ x: 20, y: 20, width: 10, height: 10, fill: "blue" })
.style("cursor", "pointer")
.call(drag);

// Define drag beavior
var drag = d3.behavior.drag()
    .on("drag", dragmove);

function dragmove(d) {
  var x = d3.event.x;
  var y = d3.event.y;
  d3.select(this).attr("transform", "translate(" + x + "," + y + ")");
}

两个问题：

1. 如何使拖动移动起作用？
2. 为什么我的 rect 没有显示出来？

Answer 1

http://jsfiddle.net/5hemY/1/

快速调试让我发现drag 在您尝试.call() 时尚未定义