在Three.js

Question

我目前关注Jerome Etienne this tutorial关于使用Three.js创建程序城市的问题。在我使用73版时，本教程使用了Three.js的第59版。

问题来自教程中的这一行，

THREE.GeometryUtils.merge( cityGeometry, buildingMesh );

该方法不再可用。根据此answer实现此目的的新方法是，

buildingMesh.updateMatrix();
cityGeometry.merge( buildingMesh.geometry, buildingMesh.matrix );

但是，当我这样做时，UV地图中屋顶的位置会发生变化。

这是我单独渲染建筑物时的样子

这就是我合并它们时的样子。请注意UV地图中的屋顶位置

根据教程，屋顶UV图的规格。具体来说，

geometry.faceVertexUvs[0][4][0].set( 0, 0 );
geometry.faceVertexUvs[0][4][1].set( 0, 0 );
geometry.faceVertexUvs[0][4][2].set( 0, 0 );
geometry.faceVertexUvs[0][5][0].set( 0, 0 );
geometry.faceVertexUvs[0][5][1].set( 0, 0 );
geometry.faceVertexUvs[0][5][2].set( 0, 0 );

并创建buildingMesh如下（在for循环中，其中n是建筑物的数量），

var buildingMesh = new THREE.Mesh( geometry );

为了使合并的网格符合几何体的UV贴图，我需要更改或做些什么？

Answer 1

这是使用最新three.js版本（v79）的版本。从您的代码中，我不知道我的更新与您的更新有何不同，但所有屋顶都正确呈现：

https://codepen.io/Sphinxxxx/pen/WrbvEz?editors=0010