merry-go-round | based component library for building amazing carousels | Frontend Framework library
kandi X-RAY | merry-go-round Summary
kandi X-RAY | merry-go-round Summary
Merry-go-Round is a React-based component library for building amazing carousels!
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of merry-go-round
merry-go-round Key Features
merry-go-round Examples and Code Snippets
Community Discussions
Trending Discussions on merry-go-round
QUESTION
I am trying to construct a merry-go-round using three.js. I loaded my horse model and want to clone it 8 times and place it in equal intervals in a circle. I know I can use math, and sin and cos functions to do this, but I wanted to try something different and I can't get it working.
Basically what I want to do is place the horse in a single place, rotate the merry-go-round object, and place the next horse in the same single place. I was thinking that if I do this, because the merry-go-round is rotating it will place each horse in a different place in the merry-go-round.
What ends up happening, to the best of my understanding, is that first it adds all the horses (and have them overlap) and then it does all of the rotations. Thus I only see a single horse. Is this really whats happening? What can explain this? How can I solve this?
Here is my code:
...ANSWER
Answered 2018-Apr-01 at 22:28If you add an object a to another object b (either THREE.Group
or any other THREE.Object3D
), the position of a is always interpreted as relative to object b's origin and transformation. This is the whole point of having this hierarchy (otherwise the objects couldn't rotate with the parent when it is rotated and your merry-go-round would be pretty boring).
What you want is to specify coordinates in world-space ("this is the exact place I want that horse to be, no matter how the merry-go-round is rotated") and re-interpret this position as relative to the merry-go-round. You can do that in three.js using the worldToLocal
-function.
So in your example:
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install merry-go-round
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page