Closed Alwinator closed 6 months ago
I also ran into this, ended up using a fade-in effect by setting cloud opacity to zero to start and tweening the opacity back up after the globe loads. It's not exactly the same as tying the animations together, but it still provides a decent looking transition
Thanks for reaching out @Alwinator.
I think there's two ways to achieve this. One is to add the clouds directly as a child of the Globe object instead of the global scene, so that they inherit the animation transformations. This what has been done in this example (https://github.com/vasturiano/three-globe/commit/2c52b4ca5b962007799fd0e41f26a55744c49801)
The second is to cancel the inner animation altogether (via animateIn: false
) and then animate both the globe and clouds as a group yourself externally.
Thank you so much @vasturiano! Since I migrated to globe.gl in the meantime, is there also the option to add the clouds to the globe directly?
@Alwinator in that case I would suggest to add it as a custom layer, so that it stays attached to the globe.
@vasturiano Thank you so much! I works like a charm! I love your library and I am very grateful that you made it. :)
Is your feature request related to a problem? Please describe. When loading the website, the Globe makes a beautiful animation. However the Clouds do not make this animation which looks weird in my opinion. See official demo: https://vasturiano.github.io/three-globe/example/clouds/
Describe the solution you'd like I would love to see some feature to animate the clouds and the Globe together in the initial animation.
Describe alternatives you've considered I thought of animation the Clouds in a similar way, but I will never get the exact same timing as the Globe.