Question

我查看了一些d3 drag个问题和examples，但我找不到将元素永久附加到鼠标的方法。

例如，假设我在d3中创建了一些行：

var height  = $(document).height() - 20;
var width   = $(document).width() - 20;
var svgSelection =  
  d3.select("body")
    .append("svg")
    .attr("width", width)
    .attr("height", height);
var lines = 100;

for (var i = 0; i < lines; i++){
    var myLine = svgSelection
        .append("line")
        .attr("x1", Math.random() * width)
        .attr("y1", Math.random() * height) 
        .attr("x2", width/2)
        .attr("y2", height/2)
        .style("stroke", "black")
        .style("stroke-width", 5)
        .style("visiblity", "visible");
}

如何将"x1"和"y1" .attr无限期地附加到鼠标位置？这意味着我可以随时移动"x2"和"y2" .attr，同时保持线条的另一端连接到鼠标。是否有捷径可寻？

（当然，这只会在任何旧的<svg>块中。）

Answer 1

执行此操作的方法是将鼠标处理程序附加到整个SVG，并在处理程序函数中获取鼠标位置并更新所需的坐标。你可以看到我在说什么here（点击节点并在按住点击的同时移动鼠标）。

将d3元素附加到鼠标的最简单方法是什么？

1 个答案: