When a wall appears, the shadow is not blocked

The shadow created by the green cube:

The red plane is the wall:

There should be no shadow behind the red plane

Set receiveShadow for the wall mesh to true.

it looks like this:

There’s still a shadow behind the wall.

Try to replace the plane mesh with a box so the wall has a depth.

After trying it, it didn’t work as expected:

The main code is as follows:

// 创建物体
    const geometry = new THREE.BoxBufferGeometry(4, 4, 4); // 生成几何体
    const material = new THREE.MeshLambertMaterial({
        color: 0x00ff00,
    const mesh = new THREE.Mesh(geometry, material);
    mesh.castShadow = true;
    mesh.position.set(0, 2, 0);
    // 遮挡物
    const geometry2 = new THREE.BoxBufferGeometry(6, 6, 3);
    const material2 = new THREE.MeshLambertMaterial({
        color: 0xff0000,
    const mesh2 = new THREE.Mesh(geometry2, material2);
    mesh2.receiveShadow = true;
    mesh2.position.set(0, 3, -4);

    // 创建地面
    const planeGeometry = new THREE.PlaneGeometry(300, 300);
    const planeMaterial = new THREE.MeshLambertMaterial({
        // 生成材质
        color: 0xcccccc,
    const planeMesh = new THREE.Mesh(planeGeometry, planeMaterial);
    planeMesh.receiveShadow = true;
    planeMesh.rotation.x = -Math.PI / 2; //绕X轴旋转90度

    // 创建平行光源
    const light = new THREE.DirectionalLight(0xffffff, 1);
    light.position.set(3, 8, 10);
    light.castShadow = true; // 允许生成阴影

It seems the best you can achieve is this: Edit fiddle - JSFiddle - Code Playground

Meaning let the wall itself cast a shadow.

ok, thank you

You can cut your floor in half (make it two separate meshes) - one half before the wall will receive shadow, the other won’t.