Spline + DataTexture

Hi community!
Here is a picture:

And here is a working example: https://codepen.io/prisoner849/full/WNQNdpv

This is an attemp of saving the data of a spline into THREE.DataTexture() and using it for bending an object, that is moving along the spline.

12 Likes

How’s that fish propelling himself? His tail isn’t even moving! :grin:

I kid, this is awesome. Great work!

1 Like

looks fantastic, thanks for sharing!

1 Like

Nice :cat: it looks like this implementation

I use a little different approach for various static cases to use spline deformation on GPU and then apply it on CPU where needed for collisions, but for animation it should clearly stay on GPU.

2 Likes

@Fyrestar Oh, yeah! Sure I remember the gif of this approach :slight_smile: Its visual inspired me, though I had no idea how it works internally. And as I like to re-invent the wheel :angel:, I made it with my own vision on how it should work :upside_down_face:

Path positions and Frenet Frames (containing tangents, normals and binormals) are generated using three.js Curve class.

These are stored in a DataTexture in 4 rows.

Several years ago I wouldn’t think that I’ll have thoughts similar to ones of three.js rock stars :open_mouth:

3 Likes