In this TresJS lesson you will learn how to use OrbitControls
from the @tresjs/cientos package to add interactivity to your scenes by:
OrbitControls
TresPerspectiveCamera
componentThe @tresjs/cientos
package is part of the TresJS ecosystem and provides useful abstractions and composables to extend the core framework.
[00:00] Let's add a little bit of interaction to our scene. Because right now, if we click and we try to move around the 3 d scene, we are not able. Because right now, it's only a render. So to do this, we're gonna import something that is called orbit controls. But we're gonna import it from a different [00:20] package, which is called Tres EScientos. This package is part of the ecosystem, and it gives a lot of abstraction and compostables that you can extend the developer experience and the functionality of the core. So it comes from the word, which it means 100 in English. [00:40] K? And the idea is that it covers a lot of different abstractions, like, for example, text 3 d. We have fill FBO or frame buffer object, and we have the orbit controls right here. So different from what we have right now that we are using components [01:00] that has the trace prefix. Everything that you, get from the Tresia sientos and another packages of the ecosystem, it doesn't have the prefix. K? So the way we're gonna use it is just below the TRES spectate camera, we are gonna add orbit controls. [01:20] If we hit save, now we can move around by clicking and zoom in, zoom out from the scene by using the orbit controls. The orbit controls is just an abstraction that modifies how the camera is handled and add these event listeners so you can [01:40] navigate through.
Member comments are a way for members to communicate, interact, and ask questions about a lesson.
The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io
Be on-Topic
Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.
Avoid meta-discussion
Code Problems?
Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context
Details and Context
Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!