Three.js材质的黑色变为透明

Question

如何从具有透明黑色颜色的纹理制作Lambert材质，而不需要alphaMap。

我有一个带有云纹理的球体。我需要使其黑色透明，如果我使用混合，它会影响阴影，我需要保持像MeshPhong材质一样的行为，但只有透明的黑色颜色。

var cloudsMaterial = new THREE.MeshLambertMaterial( { 
                        color: 0xffffff, 
                        map: THREE.ImageUtils.loadTexture( "img/planets/clouds.jpg" ),

                        specular   : new THREE.Color("rgb(255,255,255)"),
                        shininess  : 0.1,                              
                        depthTest  : 0,
                        blending   : 1,
                        transparent: true,
                        bumpScale  : 1, //0.8
                        bumpMap    : THREE.ImageUtils.loadTexture( "img/planets/bump.jpg" ),                                                      
                        } );

如何正确设置混合或其他属性？

- Martin

---

尝试使用 blending:2 或 blending:THREE.AdditiveBlending。混合模式常量在这里。 - 2pha

加法混合会使纹理变成加法。我正在尝试自定义混合，但没有任何组合能够奏效。我需要让渲染器只清除颜色透明（黑色），而其他颜色保持原样，如果像素的颜色是灰色（50%黑色），那么应该有50%的透明度。我不能使用Alpha Map，因为它是自定义动画着色器，而alphaMap不是动画的。 - Martin

有几种方法可以实现，例如定义自定义着色器，但似乎最简单的方法是只需向纹理添加 alpha 通道。如果您无法修改资源，则可以在运行时执行此操作。 - Tamas Hegedus

Answer 1

我的解决方法是使用 alpha 贴图（黑白纹理，其中白色表示不透明度较低，黑色表示完全不透明）：

var t = THREE.ImageUtils.loadTexture( "clouds.jpg" );
var map = THREE.ImageUtils.loadTexture( "clouds_alpha.jpg" );
var cloudsMaterial = new THREE.MeshLambertMaterial( { 
                        map        : t,
                        alphaMap   : map,
                        blending   : 1,
                        transparent: true,                                                    
})

- Martin

Answer 2

我知道这是可以做到的。将带有黑色背景透明度的jpg混合。Martin，alphaMap：map未定义。这个问题似乎没有得到解答。

如果我没记错的话，它应该是glBlendFunc（GL_SRC_ALPHA，GL_ONE）; 我相信Threejs没有忽略它。

- greenthings

---

黑色 = 100％ 不透明 = 不透明。似乎与预期结果相反。 - greenthings