Question

我想用2个网格创建一个Pine，1个用于树干，另一个用于bush，这就是我所做的：

var pine_geometry = new THREE.Geometry();

var pine_texture_1 = THREE.ImageUtils.loadTexture('./res/textures/4.jpg');
var pine_geometry_1 = new THREE.CylinderGeometry(25, 25, 50, 6);
var pine_material_1 = new THREE.MeshBasicMaterial({
  map : pine_texture_1
});

var pine_1 = new THREE.Mesh(pine_geometry_1);
pine_1.position.x = x;
pine_1.position.y = y + 25;
pine_1.position.z = z;

pine_1.updateMatrix();
pine_geometry.merge(pine_1.geometry, pine_1.matrix);

var pine_texture_2 = THREE.ImageUtils.loadTexture('./res/textures/5.jpg');
var pine_geometry_2 = new THREE.CylinderGeometry(0, 70, 250, 8);
var pine_material_2 = new THREE.MeshBasicMaterial({
  map : pine_texture_2
});

var pine_2 = new THREE.Mesh(pine_geometry_2);
pine_2.position.x = x;
pine_2.position.y = y + 175;
pine_2.position.z = z;

pine_2.updateMatrix();
pine_geometry.merge(pine_2.geometry, pine_2.matrix);

var pine = new THREE.Mesh(pine_geometry, new THREE.MeshFaceMaterial([pine_material_1, pine_material_2]));
pine.geometry.computeFaceNormals();
pine.geometry.computeVertexNormals();

Game.scene.add(pine);

Pine正确定位，但是，整个合并形状只使用1种材料而不是2种（整个形状被第1种覆盖）我希望每个网格都有它的相应材质当mergin兼顾。

我做错了什么？任何想法？

Answer 1

经过长时间的研究后，我发现我错过了方法的额外参数＆＃39; merge＆＃39;从Geometry对象中，最后一个参数是网格必须具有材质数组的材质的索引，例如：0 - ＆gt;材料中的第一种材料＆＃39;数组...等等。

所以，我的最后一段代码如下：

pine_geometry.merge(pine_1.geometry, pine_1.matrix, 0);

var pine_texture_2 = THREE.ImageUtils.loadTexture('./res/textures/5.jpg');
var pine_geometry_2 = new THREE.CylinderGeometry(0, 70, 250, 8);
var pine_material_2 = new THREE.MeshBasicMaterial({
  map : pine_texture_2
});

var pine_2 = new THREE.Mesh(pine_geometry_2);
pine_2.position.x = x;
pine_2.position.y = y + 175;
pine_2.position.z = z;

pine_2.updateMatrix();
pine_geometry.merge(pine_2.geometry, pine_2.matrix, 1);

（注意我添加到每个合并的最后一个数字）。

然而，我想澄清一下，这种做法只适用于处理来自同一类型的各种几何形状，在这种情况下，我们要合并两个CylinderGeometry ，但是如果我们想要合并例如一个Cylinder和一个Box并添加MeshFaceMaterial，它将无法被正确识别，并且控制台将抛出我们无法读取未定义的属性贴图/属性＆＃39;尽管如此，我们仍然可以合并两种几何形状但不提供多种材料（这是我犯的一个可怕的错误）。

希望这对任何人都有帮助。

Answer 2

这是将网格与材质合并的一般功能，您还可以指定是否要将其作为缓冲区几何体返回。

function _mergeMeshes(meshes, toBufferGeometry) {

    var finalGeometry,
        materials = [],
        mergedGeometry = new THREE.Geometry(),
        mergeMaterial,
        mergedMesh;

    meshes.forEach(function(mesh, index) {
        mesh.updateMatrix();
        mesh.geometry.faces.forEach(function(face) {face.materialIndex = 0;});
        mergedGeometry.merge(mesh.geometry, mesh.matrix, index);
        materials.push(mesh.material);
    });

    mergedGeometry.groupsNeedUpdate = true;
    mergeMaterial = new THREE.MeshFaceMaterial(materials);

    if (toBufferGeometry) {
        finalGeometry = new THREE.BufferGeometry().fromGeometry(mergedGeometry);
    } else {
        finalGeometry = mergedGeometry;
    }

    mergedMesh = new THREE.Mesh(finalGeometry, mergeMaterial);
    mergedMesh.geometry.computeFaceNormals();
    mergedMesh.geometry.computeVertexNormals();

    return mergedMesh;

}

var mergedMesh = _mergeMeshes([trunkMesh, treeTopMesh], true);

在Three.js中为多个材质使用合并的几何图形

2 个答案: