修改

Question

我试图在一个简单的three.js应用程序中动态重建THREE.Line对象中的某些几何体，但由于某种原因，不会触发更新。我已将该行设置为动态对象，并且每次更新几何图形时都将verticesNeedUpdate属性设置为true，但该行仍未更新。谁能看到我做错了什么？

// ---------------------------------------------------------------------------------------
// line
// ---------------------------------------------------------------------------------------


function build_line(length) 
{
    var vertices = [];
    for (i = 0; i < length; i++)
    {
        vertices.push(new THREE.Vector3(i * 2, 0, 0)); 
    }

    return vertices;
}


var line_geo = new THREE.Geometry();


line_geo.vertices = build_line(3);
line_geo.dynamic = true;

console.log(line_geo);


// simple
material = new THREE.LineBasicMaterial({
    color: 0xffffff,
    linewidth: 1,
    linejoin: "mitre"
});


var scene_object = new THREE.Line(line_geo, material);

scene.add(scene_object);



// ---------------------------------------------------------------------------------------
// render loop 
// ---------------------------------------------------------------------------------------

var current_length = 3

var render = function()
{
    current_length += 1;
    line_geo.vertices = build_line(current_length);
    line_geo.verticesNeedUpdate = true;

    // draw!
    requestAnimationFrame(render);
    renderer.render(scene, camera);
}

render();

修改

根据这篇文章

Adding geometry to a three.js mesh after render

你不能重新调整缓冲区的内容只能重新填充它。这个页面提到你可以通过初始化超大的缓冲区并保持未使用的顶点被包裹或隐藏来模拟缓冲区的大小调整

https://github.com/mrdoob/three.js/wiki/Updates

我不确定你是怎么做到这一点的，我无法在使用顶点的THREE.Vector3我看到可见性标记或崩溃标记。我尝试用空值替换向量，但是会引发错误。有什么想法如何实现这个？

Answer 1

最后，折叠可以被理解为＆＃34;在同一个地方＆＃34;。（可能还有其他方法可以理解它）

这意味着您需要分配最大长度

var vertices = [];

function allocate_line(maxLength) 
{
    var vertices = [];
    for (i = 0; i < maxLength; i++)
    {
        vertices.push(new THREE.Vector3(0, 0, 0)); 
    }
}

然后

function build_line(length) 
{
    for (i = 0; i < length; i++)
    {
        vertices[i].x = i * 2; 
    }
    for (i = length; i <= maxLength; i++)
    {
        vertices[i].x = (length - 1) * 2; 
    }
}

也就是说，所有未使用的顶点都设置为最后一个使用过的顶点。

这当然是一个快速而肮脏的实现，可以为您提供想法..

更新THREE.Line（）中的顶点

修改

1 个答案: