有效地连接大型连续生成的阵列

时间:2016-04-05 21:07:15

标签: javascript arrays google-chrome three.js concatenation

我将许多长数组(80个数组,每个80,000个元素,最终更多)组合成几个单独的数组(每个数组包含1,600,000个元素),作为属性在Three.js BufferGeometry中上传。我努力让这个过程足够高效,不会冻结浏览器。我已经过了那一点,但它仍然很缓慢。有没有什么方法可以加快这一点 - 我应该考虑优化?我尝试使用push.apply,这大大加快了这个过程,但最终超出了调用堆栈。我目前正在使用concat,但是想知道是否将流程转换为字符串或其他数据结构,然后再返回可能会有所帮助?其他想法?我听见了。

以下是有问题的代码块:

var motifMinBufferSize = 80000;

function setMinimumBufferSize( pointCloudAttributeArray, itemSize, fillValue ) {
    // buffers cannot be resized once they've been sent to the graphics card, so I am emulating resizing by setting a minimum buffer size that exceeds the number of vertex positions in the largest known point cloud.
    supplementalArray.fill( fillValue );
    var fullArray = pointCloudAttributeArray.concat( supplementalArray );
    return fullArray;
}


function flattenVertexArray( array ) {
    var flattenedArray = [];
    for ( var i = 0; i < array.length; i++ ) {
        flattenedArray.push( array[i].x, array[i].y, array[i].z );
    }
    return flattenedArray;
}


function concatArrays( gridArray, motifArray ) {
    var newGridArray = [];
    newGridArray = gridArray.concat( motifArray );
    return newGridArray;
}


function compileGridOfPointCloudAttributes( ... ) {

    ...code to compile the attributes for a BufferGeometry representing a grid of point clouds...
    // Skipping ahead in the function:
    for ( var i = 0; i < 80; i++ ) {
        ...
        // I have 8 of these attributes that gradually accumulate representing 80,000 values each for 80 different particle clouds:
            var position = flattenVertexArray( motif.position );
            var aGridPosition = flattenVertexArray ( motif.aGridPosition );

            pointCloudGridAttributes.aPointCloudIDPerVertex = concatArrays( pointCloudGridAttributes.aMotifIDPerVertex, setMinimumBufferSize( motif.aPointCloudIDPerVertex, 1, 0 ) );
            pointCloudGridAttributes.position = concatArrays( pointCloudGridAttributes.position, setMinimumBufferSize( position, 3, gridDimensions.gridWidth ) );
            pointCloudGridAttributes.aGridPosition = concatArrays( pointCloudAttributes.aGridPosition, setMinimumBufferSize( motif.aGridPosition, 1, 0 ) );
        ...continue like this for 5 more attributes...
    }
}

上下文 我正在使用由80个左右的粒子云组成的Three.js进行可视化,每个粒子云都有一个独特的点数(每个云点数超过50,000个点),并且所有点都组成一个BufferGeometry以进行高效渲染。我定期将点云替换为另一个,但了解到缓冲区几何中的缓冲区一旦实现就无法调整大小,所以我现在有一个固定的,超大的阵列专用于每个点云。

0 个答案:

没有答案