Избегайте прыжков текста SVG с привязкой текста при перетаскивании

Вот текст SVG с привязкой:

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width:200px;height:200px;">
  <text x="50" y="30" fill="red" text-anchor="start">I love SVG</text>
</svg>

Теперь, если я напишу функцию перетаскивания:

var dragMove = function (d,i) {
    //d3.select(this).attr("text-anchor", "null"); Does not work
    d3.select(this).attr("x", d3.event.x)
                .attr("y", d3.event.y);
};

var dragEnd = function (d,i) {
    //d3.select(this).attr("text-anchor", "start"); Does not work
};

var drag = d3.behavior.drag()
                .on("drag", dragMove)
                .on("dragend", dragEnd);

d3.select("svg")
    .select("text")
    .call(drag);

Он прыгает после того, как вы перетащите его в зависимости от его якорной позиции. Есть ли этому решение?

Я попытался установить для текста привязки значение null, а затем снова установить его, но это не работает. Я не хочу, чтобы пользовательский опыт перетаскивания вообще менялся. Даже когда перетаскивание заканчивается.

Любая идея?

Вот JSFiddle:http://jsfiddle.net/sewVr/

Ответы на вопрос(2)

Ваш ответ на вопрос