Hello everyone,
I’m working on a project where I cannot use any assets, so I cannot load any images or textures from disk, and I’m puzzled about how to create an environment map from scratch in code. I’ve searched for a similar topic but I could not find any examples on this. Could someone point me in the right direction?
What I’m looking for is for a way to create my own cube-map without any assets, so that I can pass it to a Standard Material via the envMap option. I figured I could create my own map in a shader and pass the texture through. I’m fairly proficient with GLSL, but I’m not familiar enough with Three.js yet to figure out how to set that up.
Many thanks!
1 Like
THREE.RoomEnvironment would be a good starting point – see this example three.js examples and the RoomEnvironment.js source.
1 Like
this is react but it could give you some hints as to how to shape the api perhaps: Building live envmaps - CodeSandbox this lets me define the environment with real threejs primitives, and suddenly planes become light-formers/area-lights, circlegeometry becomes a ring-light, etc. you’re painting form with lights and shadows. btw in threejs the environment can also be “live”, so you can move things in it.
1 Like
You can use for environment
new THREE.PMREMGenerator(renderer).fromScene(scene).texture
https://threejs.org/docs/?q=rend#api/en/extras/PMREMGenerator.fromScene
I used it here for reflection on the balls in “moleculas” (in the page bottom)
1 Like
Thank you everyone! I have now a clear idea of how to set it up 