Troubleshooting Shadow Issues in Three.js

Based on your description, there are several potential reasons why your objects might still be casting shadows despite setting castShadow = false. Here are some possible solutions:

Check Object Hierarchy

If your object is part of a group or has child objects, you need to ensure that castShadow is set to false for all relevant objects in the hierarchy:

JAVASCRIPTCopied
// Recursively set castShadow to false for an object and all its children
function disableShadows(object) {
  object.castShadow = false;
  object.receiveShadow = false;
  
  if (object.children && object.children.length > 0) {
    object.children.forEach(child => disableShadows(child));
  }
}

disableShadows(mesh);

Material Visibility

Even with opacity: 0, the object is still considered for shadow calculations. Try these approaches:

1. Set the material's visible property to false:

JAVASCRIPTCopied
material.visible = false;

2. Or use a different approach with the material:

JAVASCRIPTCopied
// Option 1: Use MeshBasicMaterial which doesn't interact with lights
var material = new THREE.MeshBasicMaterial({
  transparent: true,
  opacity: 0
});

// Option 2: Adjust the material's shadow side property
material.shadowSide = THREE.DoubleSide; // or FrontSide or BackSide

Light Configuration

Check your light configuration. For each light that casts shadows:

JAVASCRIPTCopied
// Make sure the light's shadow camera is properly configured
light.shadow.camera.near = 0.5;
light.shadow.camera.far = 500;
// For directional lights, adjust the frustum
light.shadow.camera.left = -100;
light.shadow.camera.right = 100;
light.shadow.camera.top = 100;
light.shadow.camera.bottom = -100;

Object Layers

You can use layers to exclude objects from shadow calculations:

JAVASCRIPTCopied
// Create a layer for non-shadow-casting objects
const NON_SHADOW_LAYER = 2;

// Set the object to that layer
mesh.layers.set(NON_SHADOW_LAYER);

// Configure your light to ignore that layer
light.shadow.camera.layers.disable(NON_SHADOW_LAYER);

Check for Clones or References

Ensure you're not accidentally creating clones or references of the object that still have castShadow set to true.

Without seeing the attached image you mentioned, these are the most common issues that could cause objects to cast shadows despite having castShadow set to false. Try these solutions and see if they resolve your issue.