Question

我想移动一段我的代码，我在其中构建一个THREE.Geometry对象到HTML5 Web Worker。

由于我不想将其序列化为字符串（出于明显的性能目的），我想将其转换为类似ArrayBuffer，File或Blob的Transferable Object，以便我可以通过引用将其传递给它”

您是否知道将THREE.Geometry转换为其中一个对象的有效方法？

Answer 1

最有效的方法是使用现有的几何缓冲区，例如：

geometryGroup.__vertexArray
geometryGroup.__normalArray

它们是在WebGLRenderer.initMeshBuffers。

中创建的

工作原理：

使用importScripts("/js/lib/mrdoob-three.js-35db421/build/three.js");
在工作人员中，您可以创建另一个要处理的几何体实例。
现在缓冲区可用，在主要renderer.render(scene, camera);中触发一个初始渲染...
从主线程向工作人员发送所需的缓冲区
在工作线程上对几何体进行艰苦的工作

手动（在threejs中不支持）填充所需的缓冲区（参见WebGLRenderer.setMeshBuffers)例如：

var vertexArray = new Float32Array(vertexBuffer);
var normalArray = new Float32Array(normalBuffer);

var vertices : Array = geometry.vertices;
var obj_faces : Array = geometry.faces;

var offset = 0;
var offset_normal = 0;

for (f in 0...obj_faces.length) {

    var face = obj_faces[ f ];

    var v1 = vertices[ face.a ];
    var v2 = vertices[ face.b ];
    var v3 = vertices[ face.c ];
    var v4 = vertices[ face.d ];

    vertexArray[ offset ]     = v1.x;
    vertexArray[ offset + 1 ] = v1.y;
    vertexArray[ offset + 2 ] = v1.z;

    vertexArray[ offset + 3 ] = v2.x;
    vertexArray[ offset + 4 ] = v2.y;
    vertexArray[ offset + 5 ] = v2.z;

    vertexArray[ offset + 6 ] = v3.x;
    vertexArray[ offset + 7 ] = v3.y;
    vertexArray[ offset + 8 ] = v3.z;

    vertexArray[ offset + 9 ]  = v4.x;
    vertexArray[ offset + 10 ] = v4.y;
    vertexArray[ offset + 11 ] = v4.z;

    offset += 12;
}

将缓冲区发送回主线程并在那里更新几何图形：

var geometryGroup = mesh.geometry.geometryGroupsList[0];

var _gl = renderer.context;
_gl.bindBuffer(_gl.ARRAY_BUFFER, geometryGroup.__webglVertexBuffer );
_gl.bufferData(_gl.ARRAY_BUFFER, transferVertexArray, _gl.DYNAMIC_DRAW );

如果您正在对几何进行复杂的操作，那么效果很好。了解WebGLRenderer如何创建和使用缓冲区非常重要。

如何有效地将THREE.Geometry转换为ArrayBuffer，File或Blob？

1 个答案: