从 PLYLoaders 将两个几何图形合并为一个几何图形
Posted
技术标签:
【中文标题】从 PLYLoaders 将两个几何图形合并为一个几何图形【英文标题】:Merge two geometries into one geometry from PLYLoaders 【发布时间】:2019-01-18 23:35:16 【问题描述】:我有两个 PLY 文件,我想合并为一个,但是我对 PLYLoader 的 de loader 方法有问题,如何同时访问两个 loader 的 Geometry?
我加载了两个 ply 文件并为新形状定义了新几何体(BufferGeometry 类),但变量 mesh1
和 mesh2
未定义
当我尝试访问几何属性时。
这是我的代码:
// ...
var mesh1, material1;
var mesh2, material2;
var singleGeometry, material, mesh;
// ...
init();
animate();
singleGeometry = BufferGeometry();
function init()
// ...
singleGeometry = new THREE.BufferGeometry();
// ...
var loader = new THREE.PLYLoader();
loader.load("path/ply1.ply", function(geometry)
geometry.computeVertexNormals();
material = new THREE.MeshStandardMaterial( color: 0x0055ff, flatShading: true );
mesh1 = new THREE.Mesh(geometry, material);
mesh1.position.y = -0.2;
mesh1.position.z = 0.3;
mesh1.rotation.x = -Math.PI / 2;
mesh1.scale.multiplyScalar(0.01);
mesh1.castShadow = true;
mesh1.receiveShadow = true;
);
loader.load("path/ply2.ply", function(geometry)
geometry.computeVertexNormals();
material = new THREE.MeshStandardMaterial( color: 0x0055ff, flatShading: true );
mesh2 = new THREE.Mesh(geometry, material);
mesh2.position.x = -0.2;
mesh2.position.y = -0.02;
mesh2.position.z = -0.2;
mesh2.scale.multiplyScalar(0.0006);
mesh2.castShadow = true;
mesh2.receiveShadow = true;
);
var loader = new THREE.PLYLoader();
loader.load("ply/Paso_1_mandible.ply", function(geometry)
geometry.computeVertexNormals();
material = new THREE.MeshStandardMaterial( color: 0x0055ff, flatShading: true );
mesh1 = new THREE.Mesh(geometry, material);
mesh1.position.y = -0.2;
mesh1.position.z = 0.3;
mesh1.rotation.x = -Math.PI / 2;
mesh1.scale.multiplyScalar(0.01);
mesh1.castShadow = true;
mesh1.receiveShadow = true;
);
loader.load("ply/Lucy100k.ply", function(geometry)
geometry.computeVertexNormals();
material = new THREE.MeshStandardMaterial( color: 0x0055ff, flatShading: true );
mesh2 = new THREE.Mesh(geometry, material);
mesh2.position.x = -0.2;
mesh2.position.y = -0.02;
mesh2.position.z = -0.2;
mesh2.scale.multiplyScalar(0.0006);
mesh2.castShadow = true;
mesh2.receiveShadow = true;
);
singleGeometry.mergeBufferGeometries([mesh1.geometry, mesh2.geometry]);
material = new THREE.MeshPhongMaterial( color: 0xff0000 );
mesh = new THREE.Mesh(singleGeometry, material);
scene.add(mesh);
【问题讨论】:
【参考方案1】:问题是您没有等待loader
加载网格mesh1
和mesh2
,然后再尝试合并它们。
我们可以将其重构为使用Promises,这使得处理异步加载变得更加容易。
(我已经删除了从单个几何图形生成网格的代码,因为它显然没有被使用。)
var plyLoader = new THREE.PLYLoader();
function loadAsset(path)
return new Promise(resolve =>
plyLoader.load(path, resolve);
);
var singleGeometry, material, mesh;
Promise.all([
loadAsset("ply/Paso_1_mandible.ply"),
loadAsset("ply/Lucy100k.ply"),
])
.then(geometries =>
geometries.forEach(geometry => geometry.computeVertexNormals());
var singleGeometry = new THREE.BufferGeometry();
singleGeometry.mergeBufferGeometries(geometries);
material = new THREE.MeshPhongMaterial( color: 0xff0000 );
mesh = new THREE.Mesh(singleGeometry, material);
scene.add(mesh);
)
.then(() =>
animate();
);
【讨论】:
这段代码应该在init函数里面吗?因为现在我无法渲染 “我无法渲染”是什么意思?你有错误吗?它在哪里并不重要,但您应该仅在加载所有内容后才开始渲染内容,即现在那里有animate()
调用。
不,我没有收到任何错误,我试图表示我在场景或浏览器中看不到网格
那么我认为生成的网格或几何体有问题。您可以添加console.log()
s 以查看geometries
对象和singleGeometry
对象是否正确。
我尝试先在.then
中打印一些元素,但没有显示任何内容,就像从未进入过那里:(以上是关于从 PLYLoaders 将两个几何图形合并为一个几何图形的主要内容,如果未能解决你的问题,请参考以下文章