I have everything for a 3d implementation with Three.js working in a plain js app. I am using BufferGeometry for lines and meshes and I am modifying the position attribute to modify their shapes.
Now I am using Ionic and converting the 3d stuff to be inside an angular component. I have everything working except I am unable to update the position values in the bufferAttribute.
I was using this in the original js to get positions array to modify:
var vrts = myMesh.geometry.attributes.position.array;
Then I could modify and set the vrts array values with things like:
vrts[0] = newValue;
and I was then setting needsUpdate = true with:
myMesh.geometry.attributes.position.needsUpdate = true;
Everything was working fine in the js app.
In the Ionic app, when I tried to point to get positions array it said: Property 'attributes' does not exist on type BufferGeometry | Geometry so I converted to this:
vrts = (this.geometry.getAttribute("position"));
and now I can access the values with:
vertexValue = vrts.array[0];
But, when I try to modify the value, ie:
vrts.array[0] = newValue;
It says: error TS2542: Index signature in type 'ArrayLike< number>' only permits reading
and won't allow me to modify the value.
I also had some trouble accessing the needsUpdate variable. I was previously using:
myMesh.geometry.attributes.position.needsUpdate = true;
and have now converted to this, but not sure if it is correct:
(<THREE.BufferAttribute>vrts).needsUpdate = true;
I am also trying to set the 'positions' array to be dynamic with the following statement:
(<THREE.BufferAttribute>this._geometry.getAttribute("position")).setUsage(THREE.DynamicDrawUsage);
I am using BufferGeometry for lines and meshes. Maybe my alternative is to create a new positions array and use setAttribute('position', newPositions) each time I modify things, but it seems like this would defeat the purpose of efficient memory use by allocating new memory every time things are changed.
Thank you for your advice!
