我是jquery的新手，正在学习snap.svg，不知道这段代码是如何工作的?有人可以解释一下函数是如何得到值的

I'm new to jquery and learning snap.svg and don't kow how this code work? Can someone Please explain how the function is getting values?

本文关键字：解释 何得 函数 一下 工作 何工作 不知道 svg snap 学习 段代码      更新时间：2023-09-26
var s = Snap("#svgout");
var innerCircle = s.circle(150, 150, 80).attr({
    fill: "none",
    stroke: 'red',
    strokeWidth: 30,
    strokeDasharray: "10 300 40 10 10 10 10 10 10 10 10 10 10 10 10 10 10",
    strokeDashoffset: 50
});

代码如下。这个函数是如何工作的?这些值是什么某种参数/参数/数组这些是什么?

Snap.animate(0,40, function( value ){ // 0,40 what are these?...
       innerCircle.attr({ 'strokeDashoffset': value })
alert(value);
},5000 );

来自SnapSVG文档:

Snap.animate(from, to, setter, duration, [easing], [callback])

把你给Snap的电话分开。动画上图:

var from = 0; // starting value
var to = 40; // ending value
var setter = function ( value ) { // value will be somewhere between 0 and 40
    innerCircle.attr({ 'strokeDashoffset': value })
}; // called by SnapSVG to change the strokeDashoffset
var duration = 5000; // 5000 milliseconds (or 5 seconds)
// Using the above values, this is the equivalent to your original call 
Snap.animate( from, to, setter, duration );

0,40是动画的开始值和结束值

我认为'setter'函数是在整个持续时间内使用当前'value'调用的。该值将介于0和40之间，取决于它在动画中的距离(因此在2.5秒时，它将是20)

相关文章：