Three.js合并几何非常慢

时间:2013-09-03 15:46:20

标签: javascript coffeescript three.js

我只是在学习Three.js,并且发现文档很难处理(整个地方都有很多“todos”)。

我只是想在屏幕上显示50,000到500,000个红色球体。这段代码是以Doob先生的城市例子(http://www.mrdoob.com/lab/javascript/webgl/city/01/)为模型的。唯一的区别是我的速度很慢,或者实际上在某些情况下挂起Chrome(在MBP视网膜上):

moleculeGeometry = new THREE.Geometry()
sphereGeometry = new THREE.SphereGeometry 0.7, 6, 6
sphereMaterial = new THREE.MeshLambertMaterial {color: 'red'}
sphere = new THREE.Mesh sphereGeometry, sphereMaterial

alert 'start merging'

for i in [0...90000]
    sphere.position.x = atoms.coords[i][0]
    sphere.position.y = atoms.coords[i][1]
    sphere.position.z = atoms.coords[i][2]
    THREE.GeometryUtils.merge moleculeGeometry, sphere

alert 'finished merging'

mesh = new THREE.Mesh moleculeGeometry, sphereMaterial
scene.add mesh

render()

这里有什么想法吗? “开始合并”警报和“完成合并”警报之间的时间非常长,如果它甚至完成而不是挂起。

可能的想法包括

  • 预分配几何体的顶点数组。我想每次将球体合并到整体几何体中时,会分配更多的内存

  • 一次合并两个球体的集合,然后一次合并其中两个集合,然后重复此过程,直到合并整个“场景”。 (这个技术有一个名字,但我不记得它叫什么。)这看起来有点过分。在现代计算机上,90,000次合并不应成为任何瓶颈。

由于

1 个答案:

答案 0 :(得分:0)

从球体中移除sphereMaterial。像这样:

sphere = new THREE.Mesh sphereGeometry

你不需要它,因为sphereMaterial是在网格中。

免责声明:我也只是学习三个JS。 ; 3