无法获得svg动画

我使用ReadySetRaphael工具从InkScape导入了一个SVG。我想动画的svg，并缓解它。所以只是出于测试目的，我试图使用动画方法转换它。无法获得svg动画

我不断收到一个错误，说我的对象没有“animate”的方法。我已经检查了其他的答案，这表明我必须克隆该对象并设置最终路径，但不确定是否会这样做，或者它如何适用于我？

这是我的js代码到目前为止。

//code created using readysetraphael. Original svg made in inkscape. 
var rsr = Raphael('rsr', '744.09448', '1052.3622'); 

var layer1 = rsr.set(); 
var path2993 = rsr.path("m 344.93716,348.36218 c 0,0 34.17415,-33.06016 -1.26571,-83.92195 -35.43985,-50.86178 39.23699,-38.14634 6.32855,-91.55121 -32.90844,-53.40487 -50.62837,-36.8748 -50.62837,-36.8748 -9.49282,-0.63577 -8.85996,-0.63577 -8.85996,-0.63577"); 
path2993.attr({ 
    id: 'path2993', 
    parent: 'layer1', 
    fill: 'none', 
    stroke: '#cf0000', 
    "stroke-width": '2.92', 
    "stroke-linecap": 'butt', 
    "stroke-linejoin": 'miter', 
    "stroke-miterlimit": '4', 
    "stroke-opacity": '1', 
    "stroke-dasharray": 'none', 
    "marker-start": 'none', 
    "marker-mid": 'none', 
    "marker-end": 'url(#TriangleInL)' 
}).data('id', 'path2993'); 
layer1.attr({ 
    'id': 'layer1', 
    'name': 'layer1' 
}); 

var rsrGroups = [layer1]; 

//Animate svg 
rsr.animate({ 
    transform: 's2' 
}, 2000);

来源

2013-02-02 Khuram Malik

您的代码将通过纸张对象拉动动画调用。由于animate() is a member of Element，呼叫失败。

我假设您正在尝试对特定形状进行动画制作，例如， path2993。只需要在相关元素上调用它：

path2993.animate({transform: 's2'}, 2000);

来源

2013-02-03 10:10:41

我其实没有纸张对象。我需要首先初始化吗？只是增加上面的行，给我一个错误未捕获TypeError：对象Raphaël的集没有方法'animate' –

你实际上*做*有一个纸对象初始化，你没有调用'var rsr = Raphael 'rsr'，'744.09448'，'1052.3622'）;'，因此'rsr'就是你的论文。只是添加该行对你没有任何好处，你必须首先删除导致问题的调用（'rsr.animate（{transform：'s2'}，2000）''）。 –

@KhuramMalik，看我更新的回答 –

无法获得svg动画

回答

相关问题