Javascript 3.js–；创建半个环并设置其动画

我制作了一个戒指，只想要一半。在那之后，给它设置动画，它会从0到一半的范围内建立自己

var-geometry=new-THREE.RingGeometry（10,9,32）；
var材料=新的三网格基本材料({
颜色：0xffff00，
三面，双面，
});
var mesh=新的三个网格（几何体、材质）；
场景。添加（网格）；

---

如何存档？我不熟悉three.js。

使用

statart

和

talength

来设置半环的动画

正文{
溢出：隐藏；
保证金：0；
}

从“导入*为三”https://cdn.jsdelivr.net/npm/three@0.118.3/build/three.module.js”；
var scene=new THREE.scene（）；
var摄像机=新的三透视摄像机（60，内宽/内高，1100）；
摄像机位置设置（0,0,10）；
var renderer=new THREE.WebGLRenderer（{antialas:true}）；
设置大小（innerWidth，innerHeight）；
document.body.appendChild（renderer.doElement）；
var grid=new THREE.GridHelper（10,10）；
grid.rotation.x=Math.PI*0.5；
场景.添加（网格）；
var innerRadius=1；
var outerRadius=2；
//重建几何学
var usualRingGeom=新的3.RingBufferGeometry（内半径，外半径，32,1,0,1）；
var usualRingMat=新的3.MeshBasicMaterial（{color:0xffff00}）；
var usualRing=新的三网格（usualRingGeom、usualRingMat）；
场景。添加（通常为）；
var clock=新的三个时钟（）；
renderer.setAnimationLoop（（）=>{
设t=clock.getElapsedTime（）；
//重建几何学
usualRingGeom=新的三个环形缓冲区几何体（内半径，外半径，32,1,0，（数学sin（t）*0.5+0.5）*数学π）；
usualRing.geometry.dispose（）；
usualRing.geometry=usualRingGeom；
渲染器。渲染（场景、摄影机）；
});

RingGeometry（）

/

RingBufferGeometry（）

具有

start

和

talength

参数。但是对于动画，你必须在每一帧上重建一个几何体。