[英]d3 drag jumping to other position when clicked - origin?
Trying to drag groups. 试图拖动组。 Why doesn't origin work here? 为什么起源不起作用? Notice how it jumps when you first click on it? 注意第一次点击它时它是如何跳跃的? JSFIDDLE Based on this: http://bl.ocks.org/mbostock/1557377 JSFIDDLE基于此: http : //bl.ocks.org/mbostock/1557377
var drag = d3.behavior.drag() // construct drag behavior
.origin(function() {
var t = d3.select(this);
return {x: t.attr("x"), y: t.attr("y")};
})
.on("drag", function(d,i) {
d.x += d3.event.dx
d.y += d3.event.dy
d3.select(this).attr("transform", function(d,i){
return "translate(" + [ d.x,d.y ] + ")"
})
});
You're mixing different ways of setting positions -- you're setting transform
and cx
and cy on the circles, but not on the
g elements that you want to drag. While it can be made to work by computing the various offsets, it's much easier if you set the position for the things you're interested in (ie the
你正在混合不同的设置位置的方法 - 你在on the circles, but not on the
设置transform
和cx
和cy on the circles, but not on the
elements that you want to drag. While it can be made to work by computing the various offsets, it's much easier if you set the position for the things you're interested in (ie the
on the circles, but not on the
g elements that you want to drag. While it can be made to work by computing the various offsets, it's much easier if you set the position for the things you're interested in (ie the
elements that you want to drag. While it can be made to work by computing the various offsets, it's much easier if you set the position for the things you're interested in (ie the
g` elements) and that the drag behaviour is called on. elements that you want to drag. While it can be made to work by computing the various offsets, it's much easier if you set the position for the things you're interested in (ie the
g`元素) elements that you want to drag. While it can be made to work by computing the various offsets, it's much easier if you set the position for the things you're interested in (ie the
并且调用拖动行为elements that you want to drag. While it can be made to work by computing the various offsets, it's much easier if you set the position for the things you're interested in (ie the
则更容易。
var svgG = svg.append("g")
.attr("transform", function(d) { return "translate(" + [ d.x,d.y ] + ")"; })
.call(drag);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.