Raphael JS -- animate .text()_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-01-14 03:34 出处：网络

So I\'m using Raphael JS to try and animate. Here\'s what I\'ve tried: <!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01//EN\" \"http://www.w3.org/TR开发者_开发技巧/html4/strict.dtd\">

So I'm using Raphael JS to try and animate.

Here's what I've tried:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR开发者_开发技巧/html4/strict.dtd">
<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>  
    <script type="text/javascript" src="http://raphaeljs.com/raphael.js"></script>  
    <script type="text/javascript">
        $(window).load(function () {
            var R = Raphael("holder", 640, 480);
            var test = R.text(200, 200, "Test string");
            test.animate({cx: 20, cy: 20}, 2000);

        });
    </script>
</head>
    <body> 
        <div id="holder"> 
        </div> 
    </body> 
</html>

And my text just remains at 200,200. Any thoughts on why this won't work?

The animate function is only capable of certain attributes, and only able to animate attributes that belong to that particular object.

A text object does not have cx or cy attributes - so your example code will not animate.

You may only translate a text object as it only has x, y and text attributes.

http://raphaeljs.com/reference.html#text

If you are trying to translate the text, use the x and y attributes like this: