javascript - 是否可以随着时间的推移更改 widthSegments 参数(来自 SphereGeometry)？

Question

使用 Three.JS 我有以下球体几何形状:

        var radius = 1 ;
        var widthSegments = 12;
        var heightSegments = 12;

        var geometry = new THREE.SphereGeometry(radius, widthSegments, heightSegments);
        const material = new THREE.PointsMaterial({
            color: 'white',
            size: 0.01, 
        });

我希望它的属性 widthSegments 作为时间的函数进行更改。所以我尝试创建以下函数:

  var ChangeWidth = function (){
        var time = Date.now() * 0.0005;
        widthSegments =  Math.sin(time * 0.7) * 30;
    }

然后将其添加到我的更新函数

   function update() 
        {
            requestAnimationFrame( update );
            renderer.render( scene, camera );
            animate();    
            ChangeWidth();
        }

但是，注意实际上已经改变了。是否可以更改 widthSegments 以及变量 geometry？

编辑

用于删除几何图形并使用新的 widthSegments 值重新创建几何图形的新函数

function update() {
            scene.add(points);
            requestAnimationFrame( update );
            renderer.render( scene, camera );
            }
        update();

        while (widthSegments < 60){

        // I begin the loop by destroying the older geometry
        var DestroyGeometry = function() {
            scene.remove(points);
            points.geometry.dispose();
        }

        DestroyGeometry();    

        // Then, I create a new geometry
        const newGeometry = new THREE.SphereBufferGeometry( radius, widthSegments, heightSegments );
        points = new THREE.Points( newGeometry, material );

        // Making sure the widthSegments is going to be increase
        widthSegments += 0.5; 

        // I end creating a new function to render the NewGeometry
        var Recreate = function() {
            scene.add(points);
            requestAnimationFrame( update );
            renderer.render( scene, camera );
        }

        Recreate();
        }

但这显然行不通。 DestroyGeometry() 和 Recreate() 函数根本没有任何效果。我想知道是否可以将它们放在 while 循环中。

Answer 1

Is it possible to change widthSegments and consequently the variable geometry?

不，所有几何生成器的参数仅在构造几何时才会评估。如果您想随着时间的推移更改参数，则必须删除旧的几何图形并创建新的几何图形。像这样的东西:

scene.remove( points );
points.geometry.dispose(); // free internal buffers

const newGeometry = new THREE.SphereBufferGeometry( radius, widthSegments, heightSegments );
points = new THREE.Points( newGeometry, material ); // create new point cloud with new geometry and existing material
scene.add( points );