jquery animate函数的开始时间以及如何设置初始值

Question

我正在为折线图使用jquery.animate函数。

设置线条和圆圈符号的动画。请参考以下代码。

    _doLineAnimation: function() {
            var clipRect = $(this.chartObj.gSeriesEle).find("#" + this.gSeriesGroupEle.id + "_ClipRect").children();
            $(clipRect).animate(
                { width: parseFloat($(this.chartObj.gSeriesEle).find("#" + this.gSeriesGroupEle.id + "_ClipRect").children().attr("width")) },
                {
                    duration: 2000,

                    step: function(now) {
                        $(clipRect).attr("width", now);
                    }
                });

// the below code for animating the symbol
            var elements = $(this.chartObj.gSymbolGroupEle).children().not("defs");
            for (var i = 0; i < elements.length; i++) {
                var element = elements[i];
                this.animateSymbol(element);
            }

        }


animateSymbol:function(element) {
         var box = element.getBBox();
           var centerX = box.x + (box.width / 2);
           var centerY = box.y + (box.height / 2);
           var scaleVal;
               $(element).animate(
                   {
                       scale: 1,

                   },
                   {
                       duration: 2000,

                       step: function(now) {
                           scaleVal = now;
                           $(element).attr("transform", "translate(" + centerX + " " + centerY + ") scale(" + scaleVal + ") translate(" + (-centerX) + " " + (-centerY) + ")");


                       }
                   }
               );  
    },

我的问题是线条和符号同时都是动画。我想在线到达点时执行符号动画（即放大符号）。

所以我需要为符号动画设置一些开始时间，现在它将从0开始并在2000 ms后结束。但是，在线到达每个点之后，我需要等待一段时间来为每个符号设置动画。

我还需要在animate（）函数中设置一个开始时间，它将从这个时间开始并在2000ms后结束。

我需要在动画函数中设置一些初始值。

ex：scale：1表示它将从0开始，但我希望它从0.5开始到1.如何在animate（）函数中设置初始值？

我需要设置开始时间以及将比例值初始化为0.5。

我期待的是：

.animate ({
begintime: 1000

duartion:2000

initialvalue :scale :0.5
});

Answer 1

您可以使用jQuery.delay()来延迟动画的开头：

$(element).delay(1000).animate({}, 2000, function () {});

如果延迟不起作用，请使用setTimeout：

为元素设置动画

setTimeout(function () {
    $(element).animate({}, 2000, function () {});
}, 1000);