Modify point positions on a preloaded glTF model

Questions
, , ,
1

Hi Everyone!

I am learning React Thre Fiber building an interface that visualises/modifies preloaded glTF model.

Beginning with Paul Henschel’s shoe example: Shoe configurator - CodeSandbox

Is there a way to:
a) select and group a bunch of points or vertices on an imported glTF model
b) access each pts coordinates and update them
c) animate the transform

I know there is a position property on a RTF mesh component but not sure if I can dive deeper into modifying individual points without resorting to vanilla Three.js.

Alternatively, is it easier to animate transformation in Blender and simply play the animation in React Three Fiber?

2

Regardless of the file format, a mesh loaded in three.js uses these data structures…

You can modify positions of objects, or positions of vertices, with those APIs.

If you need to deal with specific groups of vertices, it is probably (much) easier to group them in Blender first. Similarly, complex animations like skinning or morph targets are often easier to do in Blender, then play the animation in three.js, unless you’re fairly comfortable with programming procedural animation.

3 Likes