EnvMap on custom shader

I am trying to setup a shader that is similar to a phong shader but with a couple of differences. I want to be able to add reflections, however I am running into some problems. My material looks fine if I add a Phong material and set the environment map, it works correctly, however if I make a custom shader and copy and paste the code for the phong shaders into my own shader, and set the environment map:

mesh.material.envMap = cubeCamera.renderTarget.texture;

exactly like I did for the phongshader
then my material turns black. I would greatly appreciate it if someone who has experience dealing with environment maps in custom shaders could shed some like on this for me. I was reading through the shader chunk code and I am not sure what could possibly be triggering this. My understanding is the env map is returning all 0s, however since the environment map is being passed in, I can’t imagine why it would be all 0s.

EDIT: Nevermind, I didn’t realize I had to define all of the parameters in the shader.

Hi Mikoval,

I’m trying to figure out the very same, using a texture as an envMap (not a cubeShaderCamera). What exactly do you mean by “define all the parameters”? Most parameters have default values, just the maps don’t.


After two days of struggling with this issue, I–of course–had to find the answer to my question right after posting to this thread.

Avoid the following mistakes:

  1. envMaps have to be formatted to either Cube Maps or Equirectangular Maps–see source of this three.js examples scene.
  2. ‘EquirectangularToCubemap.js’ won’t work as an envMap input.
  3. you have to define ‘material.uniforms.envMap’, as well as ‘material.envMap’ in your ShaderMaterial.