2

我创建了一个立方体（天空盒），它的每一面都使用不同的材料。使用没有问题MeshFaceMaterial：

var imagePrefix = "images-nissan/pano_";
var imageDirections  = ["xpos", "xneg", "ypos", "yneg", "zpos", "zneg"];
var imageSuffix = ".png";
var skyGeometry = new THREE.BoxGeometry(1, 1, 1);
var materialArray = [];
for (var i = 0; i < 6; i++) {
    materialArray.push(new THREE.MeshBasicMaterial({
        map: THREE.ImageUtils.loadTexture(imagePrefix + imageDirections[i] + imageSuffix),
        side: THREE.BackSide
    }));
}

var skyMaterial = new THREE.MeshFaceMaterial(materialArray);
var skyBox = new THREE.Mesh(skyGeometry, skyMaterial);
skyBox.name = "interiorMesh";
scene.add(skyBox);

但是，现在我想在立方体的一个面上添加一种材质，并在立方体的这个面上组合材质。

所以基本上我会在立方体的 5 个面上使用一种材料，在立方体的 1 个面上使用 2 种材料——我想用另一个透明的 png 覆盖那个“原始”纹理，这样它就只覆盖了原始图像的特定部分。两张图片的尺寸相同，只有新的一张是部分透明的。甚至可以用 CubeGeometry 做吗？还是我需要用飞机来做？非常感谢任何帮助！

4

1 回答 1

1

您肯定可以更改其中一张脸的材质。但是，您不能对一张脸使用两种材料。

我建议创建其他纹理作为前两者的组合，将其制成单独的材质，并在需要时将其分配给立方体的第六面。如果可能，请事先在您选择的图形编辑器中合并这些图像。如果您只能在运行时执行此操作，您将不得不使用画布来合并它们，或者按照@beiller 的建议使用着色器。

我不推荐透明平面，透明度有时会非常棘手，并且渲染方式很奇怪。

这里讨论了类似的东西 - Three.js 中同一网格面上的多个透明纹理

于 2014-11-19T09:51:14.273 回答