“Stuttering” drag when using d3.behavior.drag() and transform

Question

I\'m trying to use d3.js\'s d3.behavior.drag() drag event to update my data model (without setting the element position immediately), then run my \

Answer 1

I had the same issue as Darwin. The drag handler is on the child object that has D3 Data attached but the transform needs to be applied to the parent group (not d3).

I solved it by setting the origin function to return x:0, y:0 and then using the x value in the event rather than the dx.

e.g

var drag = d3.behavior.drag()
    .origin(function(d,i) { return {x:0, y:0}; })
    .on("drag", function (d) {  movePosition(d3.event.x);   });