缩放和旋转在Raphael.js

Question

我没有得到如何Raphael.js转换功能的作品。我有以下的代码：

var paper = new Raphael(0,0,1000,1000); 
var rect = paper.rect(0,0,40,40); 
rect.transform("s2,2,0,0t30,30"); 

变换的结果是在每个轴代替30.为什么缩放影响穿越 - 60像素运动？

Answer 1

If a list of transforms is provided, then the net effect is as if each transform had been specified separately in the order provided.例如，

var rect = paper.rect(0,0,40,40); 
rect.transform("s2,2,0,0t30,30"); 

在功能上等同以下SVG标记（即使这实际上不是什么拉斐尔会产生）

<g transform="scale(2)"> 
    <g transform="translate(30,30)"> 
    <rect x="0" y="0" width="30" height="30"/> 
    </g> 
</g> 

因此，从内到外，我们有一个开始直接在x1，y1，x2，y2 = 0,0,30,30这是在翻译<g>它将其移动到30,30,60,60，然后在缩放<g>缩放到60,60， 120,120即60个像素的平移。