TresJS is now released and Open-source 🎉 In this second video, we will bring our cube to life by adding animations by using the useRenderLoop composable and Vue's Template Refs.
As always, you can support us with a nice Like, and don't forget to subscribe for more 3D content on Vue.
Resources
- Repository of the code used in this tutorial https://github.com/alvarosabu/tresjs-basics/tree/feat/animate-objects
- TresJS Basic animations https://tresjs.org/examples/basic-animations.html
- Playground https://playground.tresjs.org/
- requestAnimationFrame https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame
----
00:00 - Intro
00:09 - Previous Recap
00:25 - How animation works
01:37 - Frames Per Second (FPS)
02:11 - requestAnimationFrame in ThreeJS
04:14 - useTweakPane fps graph
04:36 - Animating using TemplateRefs and onLoop
09:55 - delta and elapsed
11:13 - Animate with Trigonometry
12:48 - Outro
Download
0 formats
No download links available.
TresJS - Animate your 3D Objects with Vue | NatokHD