如何使用snap.svg获取svg对象的旋转值?

如何使用snap.svg获取svg对象的旋转值?,svg,snap.svg,Svg,Snap.svg,因此,我使用snap.svg,并且我想随时间动态地旋转一个对象。大概是这样的: function rotateObject() { myObject.rotation += value; } snap = Snap(800,600); circle = snap.circle(400,300,50); 问题是我不知道如何访问我的显示对象的旋转值(或者如果它们存在的话!),所以简单地说,假设一个圆声明如下: function rotateObject() { myObje

因此,我使用snap.svg,并且我想随时间动态地旋转一个对象。大概是这样的:

function rotateObject()
{
    myObject.rotation += value;
}
snap = Snap(800,600);   
circle = snap.circle(400,300,50);
问题是我不知道如何访问我的显示对象的旋转值(或者如果它们存在的话!),所以简单地说,假设一个圆声明如下:

function rotateObject()
{
    myObject.rotation += value;
}
snap = Snap(800,600);   
circle = snap.circle(400,300,50);
我知道我可以像这样访问x和y值:

circle.attr("cx");
circle.attr("cy");
我需要帮助的是:

  • 是否有某种类型的旋转属性可用于旋转此对象
  • 如果没有,如何使用snap.svg旋转对象

  • 理想情况下,您将自己控制旋转(而不是从属性中找出它,这是可能的,但更烦躁)。动画可以更容易,这取决于您需要什么。下面是一个例子,展示了一些带有矩形的基本动画(如果围绕中心旋转,则圆本身就是旋转的)

    摆弄


    实际上,最好是对SVG的转换(以及平移、旋转、缩放)有一个基本的了解,让它更有意义。您可以使用myRect.attr(“transform”)来“查看”生成的变换,但我可能会在一开始就保留它。

    最好使用

    当我使用Chrome版本<36.0时,所建议的方法对我非常适用 当我将Chrome更新到36.0.1985.125时,我看到了文本旋转的bug

    所以,溶液正在使用

    var matrix = new Snap.Matrix();
    matrix.rotate(-90, x, y);    
    Paper.text(x, y, 'Text').attr({
                        fontWeight: 'bold',
                        fill: '#434343',
                        transform: matrix
                    });
    
    而不是

    Paper.text(x, y, 'Text').attr({
                        fontWeight: 'bold',
                        fill: '#434343',
                        transform: 'r-90'
                    });
    

    也许它会对某些人有用。

    好吧,这很有道理,给了我一个前进的方向。非常感谢你!