How to fix the shadow intensity using boxgeometry

image

I want to have the shadow like this .but my shadow comes like this…

image

any suggestion. any help would be greatly appreciated

The simple “allround”-solution is using Ambient Light to modulate shadow intensity.

Another option would be to set Hemisphere Light.

The ThreeJS demo:

https://threejs.org/examples/?q=Hemi#webgl_lights_hemisphere

1 Like

okay, I was able to fix the shadow but in the same image you can see that light impacts the cube also. but ,in my case the shadow in appearing but cube should also get dark from behind

What comes to my mind:

  • only surfaces with Lambert and Phong material can receive shadows (do you use Basic material?)
  • your box mesh receiveShadow -property needs to be set to true

Code and demo (the back of box receives shadow):

because I’m using two properties on the cube that’s why I’m using ShaderMaterial on Boxgeometry .

So as far I’ve got no solution regarding the shadow impact on ShaderMaterial

so will it impact for that for boxgeometry also?

My knowledge on Shader is rudimentary, but I guess you can extract shadow map and combine with your shader. Do I get you right, you want to receive shadows on your ShaderMaterial?

Regarding example I found, looks like this:

var shaderMaterial = new THREE.ShaderMaterial ({   
  
  uniforms: THREE.UniformsUtils.merge([
     THREE.UniformsLib['shadowmap'],
     {
      floorColor: {type:'f', value: 0.3}
     }
    ]),
    
   vertexShader: [
    THREE.ShaderChunk[ "shadowmap_pars_vertex" ],
    "void main() {",
    "  vec4 worldPosition = modelMatrix * vec4(position, 1.0);",
    "  gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);",
    THREE.ShaderChunk[ "shadowmap_vertex" ],
    "}",
    ].join('\n'),    
    fragmentShader: [
      THREE.ShaderChunk[ "shadowmap_pars_fragment" ],
      "uniform float floorColor;",
     "void main() {",
      "  gl_FragColor = vec4 (vec3(floorColor),1.0);",
      THREE.ShaderChunk[ "shadowmap_fragment" ],
      "}",
    ].join('\n'), 
});
  box = new THREE.Mesh(new THREE.BoxGeometry(10, 10, 10),
    shaderMaterial);

Hope it helps :slight_smile: