How do I animate objects with javascript?

Ok so I’m trying to make these objects :


Become animated and move from left to right(x,y).
What is a simple way to do that

For simple entities, with no rigid bodies, I think the Playcanvas tween library is one of your best options, easy to setup and you get a lot of control over your animation.

https://developer.playcanvas.com/en/tutorials/tweening/

1 Like

Alright I’ll look into this thnx man

1 Like

Ok so I found out how to do it.
But the problem is how am I supposed to upload the library do I just add this code:


Into a tween.js script or am I suppoed to just upload this script:

You can do either!

  1. Download the tween.js file to your computer and drag and drop it to your project.

  2. Create a tween.js script, remove everything in there (everything!) and copy/paste all code from the tween.js file.

In both cases make sure in your project settings that the tween.js file is being loaded before any other script that uses it.

1 Like

So I added the tween.js file


Now were do I put this code:

Usually in a script attached to the entity you would like to animate, the initialize method is a good place for it.

1 Like

oh ok

Ok so I been trying tht tween.js library but it hasn’t been workin well for me.
Is there another way to animate a object?

I don’t think there is an easier one :slight_smile:

You can use the update(dt) method, and set the position per frame using Math.sin to create a periodic movement. Try searching on the internet to find some samples.

In general take a look at different kinds of animations in the relevant tutorials section:

https://developer.playcanvas.com/en/tutorials/?tags=animation

IMO, Leonidas is correct. Tween is very simple compared to any other method I’ve found.

1 Like