旋转后拉斐尔拖动对象

Question

我对拉斐尔有意见。在应用了缩放、旋转等任何变换后，我无法正确拖动对象。

var text;

Raphael.el.draggable = function () {
            var start = function () {
                    this.ox = 0;
                    this.oy = 0;
                },
                move = function (dx, dy) {
                    var x = dx - this.ox,
                        y = dy - this.oy;
                    this.transform("...t" + x  + "," + y);
                    this.ox = dx;
                    this.oy = dy;
                },
                end = function () {
                };
            this.drag(move, start, end);
            return this;
        };

var paper = Raphael(document.getElementById('canvas'), 300, 300);
paper.rect(0, 0, 300, 300).attr('fill', '#dedede');
text = paper.text(150, 150, 'ABC');
text.attr('font-size', 48);
text.transform('...r90');
text.draggable();

这是一个例子。

https://jsfiddle.net/rzj4e4x8/1/

如何更正我的移动函数以便它可以正确地将对象移动到光标方向？

Answer 1

解决方法如下：

this.transform("...T" + x  + "," + y);

大写的 T 解决了这个问题。

https://jsfiddle.net/rzj4e4x8/4/

旋转后拉斐尔拖动对象

Raphael drag object after rotation

javascript

rotation

raphael

drag