Three.js MeshBasicMaterial无法正常工作

Question

我正在尝试使用Three.js创建纹理。

我的texture_f1来源是一个.png文件，这意味着您可以通过它看到背景。

问题是，如果我尝试设置背景color: 0xffffff ，则无法与map：结合使用。

如果我只设置color:0xffffff ，它将返回白色，但是当与map一起使用时： var material_f1 = new THREE.MeshBasicMaterial({ map: texture_f1, color: 0xffffff}); 我可以通过.png黑色看到背景。

Answer 1

如果您具有透明纹理，则必须将material.transparent设置为true 。

var material = new THREE.MeshBasicMaterial( {
    color: 0xffffff,
    map: texture,
    transparent: true
} )

请注意，材质颜色不会“显示”透明纹理-它会使纹理着色 。

如果希望材质颜色“显示”透明纹理，则需要使用ShaderMaterial ，并创建一个自定义着色器。

在这个stackoverflow答案中有一个这样做的例子。

three.js r.71