Raphael JS嵌套轉換

Question

我在Raphael JS中有幾個嵌套集合，我想用photoshop中的圖層。也就是說：集合中的對象可能有自己的轉換，並且成爲集合中的相對位置。也可能有它自己的轉變。

現在看來，當應用設置變換時，它只是分別執行它到每個元素，並且絕對位置相對於頁面。

有了這個機制，我遇到了這樣一個簡單的問題：我有它的集合和矩形。然後我調整規模的矩形（0.5,0.5,0,0）;然後我想拖動整個集合。我用set.translate（x，y）執行拖動操作。結果我得到的矩形移動的速度比其他非縮放項目慢兩倍。

var rdr = this; 
this.paper = Raphael(0,0,1000,1000); 
this.set = this.paper.set(); 
this.set.push(this.paper.rect(0,0,100,100)); // non-scaled rectangle 
this.set.push(this.paper.rect(0,0,100,100).scale(0.5,0.5,0,0)); // scaled rectangle 
$("body").bind("mousedown.RDR",function(e) { 
    var ox = e.pageX; 
    var oy = e.pageY; 
    $("body").bind("mousemove.RDR",function(e) { 
    rdr.set.translate(e.pageX-ox,e.pageY-oy); 
    ox = e.pageX; 
    oy = e.pageY; 
    }).bind("mouseup.RDR",function() { 
    $("body").unbind("mouseup.RDR").unbind("mousemove.RDR"); 
    }); 
}); 

我該如何糾正這段代碼，使我的矩形以相同的速度移動？

---

理論上的一切，我需要移動一組對象的同時是控制轉化的順序的方式。我還沒有發現內置的解決方案，因此有一個小黑客工具，插入一組翻譯「之前」轉變that're已應用於元素：

Raphael.el.translateBefore = function(x,y) { 
    var matrix = this.matrix; 
    var transform = matrix.toTransformString(); 
    transform = ("t"+x.toString()+","+y.toString()) + "," + transform; 
    this.transform(transform); 
    return this; 
} 

this.paper = Raphael(this.containerId,this.paperWidth,this.paperHeight); 
// добавляем метод для raphael.set через жопу, не нашел нормальный способ 
this.paper.set().__proto__.translateBefore = function(x,y) { 
    _.each(this,function(el) { 
    el.translateBefore(x,y); 
    }); 
    return this; 
} 

Answer 1

http://raphaeljs.com/reference.html#Element.transform

// if you want you can append or prepend transformations 
el.transform("...t50,50"); 
el.transform("s2...");