Javascript three.js合并几何体和八叉树选择
我使用Three.js来显示各种位置和旋转中的许多自定义几何体。它们是静态的,很少更改,但用户可以添加、删除或更改每个对象的形状 使用下面的代码段,这一点非常有效:Javascript three.js合并几何体和八叉树选择,javascript,merge,three.js,geometry,octree,Javascript,Merge,Three.js,Geometry,Octree,我使用Three.js来显示各种位置和旋转中的许多自定义几何体。它们是静态的,很少更改,但用户可以添加、删除或更改每个对象的形状 使用下面的代码段,这一点非常有效: var Mat=new THREE.MeshBasicMaterial( { color: 0xffff00, wireframe: false, opacity: 0.5 , transparent:true} ) var Geo=new THREE.CubeGeometry( 20, 100, 20 ) var Mesh=ne
var Mat=new THREE.MeshBasicMaterial( { color: 0xffff00, wireframe: false, opacity: 0.5 , transparent:true} )
var Geo=new THREE.CubeGeometry( 20, 100, 20 )
var Mesh=new THREE.Mesh(Geo, Mat);
//Up or down rotation
m = new THREE.Matrix4().set(0.3,-0.3,0,0,0.3,0.3,0,0,0,0,1,0)
Mesh.applyMatrix(m);
Mesh.updateMatrix();
Mesh.position.x=50;
Mesh.position.y=50;
Mesh.position.z=50;
octree.add(Mesh);
Mesh.updateMatrix();
scene.add( Mesh );
上面的方法很好用,不过毫不奇怪它要处理大量的对象。关于:
我已经合并了这些对象,并在速度提升方面取得了巨大成功,它在10000多个对象上运行良好。我现在正试图再次设置选择,但在这里我被卡住了
上面的链接表明,将网格保持在数组或八叉树中将启用选择,同时保持合并对象的速度优势。我已经实现了一个八叉树,因此这应该很容易再次使用,但选择对象现在与合并的场景对象不在同一位置。选择对象位于原点,八叉树似乎失去了其对象的位置,可能还有旋转。下面是故障代码的快照:
var TotalGeo = new THREE.Geometry();
//Add Objects
var Mat=new THREE.MeshBasicMaterial( { color: 0xffff00, wireframe: false, opacity: 0.5 , transparent:true} )
var Geo=new THREE.CubeGeometry( 20, 100, 20 )
var Mesh=new THREE.Mesh(Geo, Mat);
//Up or down rotation
m = new THREE.Matrix4().set(0.3,-0.3,0,0,0.3,0.3,0,0,0,0,1,0)
Mesh.applyMatrix(m);
Mesh.updateMatrix();
Mesh.position.x=50;
Mesh.position.y=50;
Mesh.position.z=50;
octree.add(Mesh);
Mesh.updateMatrix();
//scene.add( Mesh );
TotalGeo.merge( Mesh.geometry, Mesh.matrix );
//Add merged geo
var total = new THREE.Mesh(TotalGeo, Mat);
scene.add(total);
自定义几何图形需要手动旋转和定位。欢迎有任何想法!谢谢在设置八叉树时,请确保未出错设置为true。像这样-
octree = new THREE.Octree( {
undeferred: true,
depthMax: Infinity,
objectsThreshold: 8,
overlapPct: 0.15
} );
那就应该成功了