在Three.js中，一个平面能否在另一个平面上投射阴影？

我有一架带有透明PNG（世界地图）的飞机。
我可以将阴影从一个平面投射到另一个平面上吗？

我没有成功使用此代码：

plane = new THREE.Mesh(new THREE.PlaneGeometry(200,200), new THREE.MeshLambertMaterial({color: 0xcccccc}));

var mapTexture = new THREE.ImageUtils.loadTexture("img/map_transp2.png");
    mapTexture.needsUpdate = true;
    var mapMaterial = new THREE.MeshBasicMaterial({
        color:0xaaaaaa,
        transparent:true,
        map:mapTexture,
        side:THREE.DoubleSide
    });

mapPlane = new THREE.Mesh(new THREE.PlaneGeometry(800/5,370/5), mapMaterial);

plane.receiveShadow = true;
mapPlane.castShadow = true;

---

如果网格的透明部分是用纹理书写的，则应采用不同的处理方式。

---

看看这个例子：

您的两个平面位于相同的z值上。给他们一些距离：

mapPlane.position.z = 100;

---

我也有类似的问题

我不知道为什么会发生这种情况，但我解决了它，将平面几何体更改为立方几何体（在投射阴影的平面中）

请参见

设置

或/及

renderer.shadowMap.renderSingleSided = false

可以解决这个问题

禁用此选项后，必须在光源上为可以同时投射和接收阴影的曲面设置适当的shadow.bias以正确渲染：

let dl = new THREE.DirectionalLight()
dl.shadow.bias = -0.0001

three.js r.85

见

renderer.shadowMap.renderSingleSided = false

let dl = new THREE.DirectionalLight()
dl.shadow.bias = -0.0001