Three.js: Shadow problems with THREE.DirectionalLight and THREE.MeshBasicMaterial

Created on 17 Nov 2015  路  16Comments  路  Source: mrdoob/three.js

Hi everybody!

i want to upgrade three.js to R73 in my current project. Unfortunately, i'm getting strange shadows casted by a THREE.DirectionalLight on a THREE.MeshBasicMaterial. Check out the following screenshots:

three.js R72 :+1:
shadow_r72

three.js R73 :-1:
shadow_r73

As you can see, the shadow in R73 is totally black.

OS: OS X Yosemite 10.10.5
GPU: AMD Radeon R9 M295X 4096 MB
Browser: Chrome 46.0.2490.86 (64-bit)

Question

Most helpful comment

Was trying to get softer shadows and then discovered a trick of using emissive color on the object receiving the shadow. This might help someone.

All 16 comments

Shadow darkness was removed? #7321

Sorry guys, but shadowDarkness is gone, use AmbientLight instead. shadowDarkness at 0.5 is actually the one making the shadow acne more obvious than it should.

I do think shadows are still being worked on though #6420 not sure if this landed in r73?

I have an THREE.AmbientLight in this scene but it actually has no effect on the shadow...

Try and use the development version r74 and see what you get. Lots of things have been fixed.

I changed the shadowDarkness default to 1 (to start discouraging its use). You can still do light.shadowDarkness = 0.5 but I would suggest adding new THREE.AmbientLight( 0x808080 ) to your scene instead.

I would suggest adding new THREE.AmbientLight( 0x808080 ) to your scene instead.

@Mugen87 is using MeshBasicMaterial, which does not respond to light sources. Switching to another material is required in that case.

Ah! True.

Thanks for your feedback!

@mrdoob and @WestLangley : Is using light.shadow.darkness = 0.5 in combination with MeshBasicMaterial still a valid way for tweaking shadows? Or is this approach deprecated?

Besides, maybe it's a good idea to include the new shadow handling to the migration guide. I can image, that other users run in the same issue...

@mrdoob and @WestLangley : Is using light.shadow.darkness = 0.5 in combination with MeshBasicMaterial still a valid way for tweaking shadows? Or is this approach deprecated?

For the time being it's ok. However MeshBasicMaterial is supposed to be unlit. So it shouldn't support shadows. However, http://threejs.org/examples/#webgl_geometry_spline_editor is a good use case where one can control the color of the surface and add shadow. This example is why MeshBasicMaterial still supports shadows and shadow.darkness is still available. Once I figure out how to do it in a different way the current approach may get deprecated.

For your use case, you may want to use case... Any reason you're using MeshBasicMaterial and not MeshLambertMaterial or MeshPhongMaterial?

Besides, maybe it's a good idea to include the new shadow handling to the migration guide. I can image, that other users run in the same issue...

Done.

@mrdoob

This example

just fyi this example looks like this over here:

screen shot 2015-11-18 at 23 02 39

For your use case, you may want to use case... Any reason you're using MeshBasicMaterial and not MeshLambertMaterial or MeshPhongMaterial?

I want a consistent color over the entire surface of a 3D object. MeshBasicMaterial is perfect for this, because i don't need any lights to get this effect. If there are alternate ways to do same, well, i always have an open mind for other solutions :wink:

@mrdoob Thanks again for your answers!

By the way, i close this issue because my original problem is solved!

just fyi this example looks like this over here

Looks correct to me...?

Looks correct to me...?

so the shadow is supposed to look dashed?

Yeah, I guess these are the expected artefacts when combining THREE.PCFShadowMap and lines...

Was trying to get softer shadows and then discovered a trick of using emissive color on the object receiving the shadow. This might help someone.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

scrubs picture scrubs  路  3Comments

jack-jun picture jack-jun  路  3Comments

Horray picture Horray  路  3Comments

makc picture makc  路  3Comments

donmccurdy picture donmccurdy  路  3Comments