javascript - d3 - drag node groups in radial tree layout without jumping to new position on click -
following on this question, i'm trying drag nodes (containing groups of circles , text) combined units without them first jumping new position when click.
i've tried implementing suggested technique radial tree layout (jsfiddle) hitting wall. suspect because radial layout using different x,y system usual x,y system. i've been trying work rotate
var drag
can't quite seem crack it. should focusing? thanks.
var drag = d3.behavior.drag() .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 + ")" }) });
it because of different x,y transforms used in radial view. changed drag function normal x,y coordinates
var drag = d3.behavior.drag() .on("drag", function(d,i) { var translatecoords = d3.transform(d3.select(this).attr("transform")); //gets actual transform value d.x = translatecoords.translate[0]; // set x coordinate d.y = translatecoords.translate[1]; // set y coordinate d.x += d3.event.dx d.y += d3.event.dy d3.select(this) .attr("transform", function(d,i){ return "translate(" + d.x + "," + d.y + ")" }) });
here jsfiddle link working code
Comments
Post a Comment