我试图在raphael.js中设置反制动画，但我遇到了一个奇怪的行为。在动画中间，文本值等于NaN，我不明白为什么。
这是我的代码：
<html>
<head>
<title></title>
<script src="raphael.js"></script>
<script src="jquery.js"></script>
</head>
<body>
<script type="text/javascript">
var r = Raphael(0, 0, 400, 400);
r.ca.strNumber = function (number) {
var str = number + '';
return {"text" : str};
}
$(document).ready( function() {
var t = r.text(200, 200, "1").attr({"font-size": 50, "fill": "black"});
t.animate({"strNumber": 999}, 500);
});
</script>
</body>
</html>
那有什么不对呢？如何解决这个问题？
谢谢！
我假设您想要从1到999进行动画计数。我不认为.animate（）可以帮助您这样做，而您可以使用以下代码从1到10计数：
<body>
<script type="text/javascript">
var r = Raphael(0, 0, 400, 400);
$(document).ready( function() {
counter = 1;
var t = r.text(200, 200, counter).attr({"font-size": 50, "fill": "black"});
var myTimer = setInterval(function(){
counter ++;
t.attr('text', counter);
if (counter>=10){
clearInterval(myTimer);
}
}, 500);
});
</script>
</body>
您有NaN，因为它没有自定义属性的初始值。创建文本后添加：
t.attr（{strNumber：0}）; //将初始值设为0，您可以将其设置为任何符合您需要的数字
然后你可以正常做动画