3

是否可以在three.js中创建可以接收阴影的透明/不可见平面？我的目标是在没有背景的 3d 画布上绘制一些对象（这样我就可以看到画布元素后面的网页）。我希望对象在背景上投射阴影，我想，如果我可以制作一个不可见的平面，那么网页背景仍然可见。阴影投射在平面上，看起来阴影在网页上。现在我可以制作一个不透明度为 0.5（或类似）的白色平面，但这样平面是可见的。理想情况下，平面应该完全不可见（阴影除外）。

编辑：我创建了一个示例（基于此）：http: //jsfiddle.net/s5YGu/2/

这里我的不透明度为 0.5，但你可以看到飞机。如果我将不透明度设置为 0，那么整个平面和阴影就会消失。

4

2 回答 2

5

我通过破解基本着色器来完成这项工作，这里是工作着色器代码http://pastie.org/5088640

它没有缺点 AFAIK，例如不透明度：0.1

于 2012-10-20T12:32:35.250 回答
3

是的，你可以达到你想要的效果，至少在我的机器上看起来还不错。:-)

这是一个小提琴：http: //jsfiddle.net/ZXdV3/25/

有几个问题。首先，您必须alpha: true在渲染器构造函数中设置参数。

其次，虽然我假设您希望飞机完全透明，但您必须满足于material.opacity = 0.1，或左右。

第三，如果你在网页上放置一个画布，并且你希望网页是交互式的，你将不得不在画布中抑制指针事件（虽然我不确定 IE 是否支持这一点）container.style.pointerEvents = 'none'：

三.js r.67

于 2012-10-15T00:40:47.250 回答