Three.js MeshBasicMaterial 无法按预期工作

【问题标题】：Three.js MeshBasicMaterial doesn't work as expectedThree.js MeshBasicMaterial 无法按预期工作
【发布时间】：2015-10-22 16:45:34
【问题描述】：

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

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

问题是如果我尝试设置背景color: 0xffffff 它不会与地图结合使用：。

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

【问题讨论】：

【解决方案1】：

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

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

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

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

this stackoverflow answer 中有一个这样做的例子。

three.js r.71

【讨论】：