Перетаскивание элемента с помощью d3.mouse (this) вызывает мерцание элемента

Question

У меня есть абсолютно позиционная ведущая линия в относительно позиционированном divМне нужно перемещать ведущую линию по горизонтали, когда мышь движется с помощью d3.Поскольку d3.event требует, чтобы элементы были расположены внутри g элементов, я пытаюсь использовать d3.mouse для перемещения лидирующей строки.Тем не менее, поведение перетаскивания является очень неустойчивым и мерцает слишком много.Кажется, я не могу понять, что является причиной этого.

var drag = d3.behavior
  .drag()
  .on('drag', function(event) {
    dragMoveNew(this);
})

d3.select(".grid").call(drag);

function dragMoveNew(elem) {
     var x = d3.mouse(elem)[0];

   $(elem).css('left', x);
}

Вот ссылка jsfiddle

https://jsfiddle.net/u4koenra/

Answer 1

Использование d3.event.x

function dragMoveNew(elem) {
   //var x = d3.mouse(elem)[0];
   var x = d3.event.x;

   $(elem).css('left', x);
}