angular - ThreeJS，Ionic，Angular2+ - 如何修改位置 BufferGeometry / BufferAttribute 值 - 它说 Index Signature ArrayLike是只读的

Question

我拥有在普通 js 应用程序中工作的 Three.js 的 3d 实现的一切。我正在将 BufferGeometry 用于线条和网格，并且正在修改位置属性以修改它们的形状。

现在我正在使用 Ionic 并将 3d 内容转换为角度组件内。除了无法更新 bufferAttribute 中的位置值外，我一切正常。

我在原始 js 中使用它来获取要修改的位置数组：

var vrts = myMesh.geometry.attributes.position.array;

然后我可以使用以下内容修改和设置 vrts 数组值：

vrts[0] = newValue;

然后我将 needsUpdate = true 设置为：

myMesh.geometry.attributes.position.needsUpdate = true;

在 js 应用程序中一切正常。

在 Ionic 应用程序中，当我试图指向位置数组时，它说： BufferGeometry 类型上不存在属性“属性”| 几何所以我转换成这个：

vrts = (this.geometry.getAttribute("position"));

现在我可以通过以下方式访问这些值：

vertexValue = vrts.array[0];

但是，当我尝试修改该值时，即：

vrts.array[0] = newValue;

它说：错误TS2542：类型'ArrayLike < number>'中的索引签名只允许读取

并且不允许我修改该值。

我在访问 needsUpdate 变量时也遇到了一些麻烦。我之前使用的是：

myMesh.geometry.attributes.position.needsUpdate = true;

现在已经转换为这个，但不确定它是否正确：

(<THREE.BufferAttribute>vrts).needsUpdate = true;

我还尝试使用以下语句将“位置”数组设置为动态：

(<THREE.BufferAttribute>this._geometry.getAttribute("position")).setUsage(THREE.DynamicDrawUsage);

我将 BufferGeometry 用于线条和网格。也许我的替代方法是创建一个新的位置数组并在每次修改内容时使用 setAttribute('position', newPositions) ，但这似乎会通过每次更改内容时分配新内存来破坏有效内存使用的目的。

感谢您的意见！

标签： angulartypescriptionic-frameworkthree.jsbuffer-geometry