Three.js Take out part of the shader

Good day ppl,
Here is the Example with the most beautiful clouds I’ve seen in Three.js. They are done within shaders. I’ve spent much time trying to grab them as a separate instance that could be included into Three.js Sky Dome, however I have no luck for a long time since I am not an expert in shaders. Can any1 explain how this can be done or help with this task? At the moment I’ve cut everything apart from sky dome within clouds.

The aim is to include the clouds as an optional setting in the app. Would be great to set the density as well =)

Here’s what I do when attempting to extract a piece of code that I am finding hard to understand - remove everything else from the example that you don’t want, like the box, ocean, controls etc. until you have a minimal example that still demonstrates what you want, in this case, clouds.

Once you reach this point, go over the code again and see if you can understand it now. If it’s still obtuse, then you can still package it up into a reusable module.

In this case, you may not need to edit any shader code. Perhaps you can add the Sky Dome as one module and the clouds on top as another module?

1 Like