Modified Lathe Geometry

I recently had cause to modify the lathe geometry in three.js to accept an array of paths, instead of one, so that the geometry changes as it sweeps round, for modelling shapes that have approximate but not exact rotational symmetry, like limbs and other organic objects.

It struck me that I might be reinventing the wheel, so I thought I’d ask the community here if this kind of geometry already has a name, and if there are existing examples. It’s a combination of a lathe and a loft, I think.

Also, if I modify or create a new geometry, is there a protocol for adding it to the three.js library? I’ve got it working by modifying the main three.js file, but I suspect this is an ugly hack as the geometries start off as individual source files.

Any help or advice appreciated.

Based on your description from the first paragraph I can’t think of a name for such a geometry generator^^. As a reminder:

  • When using LatheGeometry, you define the lateral contour with an array of points. This data are now used to generate the entire 3D shape around the Y axis (with perfect axial symmetry).
  • ExtrudeGeometry extrudes one or more instances of Shape along a given path or the z-axis. You can define a shape with an arbitrary amount of curve objects.

In both cases, it’s not possible to vary the contour/shape when the geometry is generated. As far as I understand, a LoftGeometry can do this. You define multiple splines/curves along the direction of extrusion and the generator ensures valid transitions and a connected triangle surface across the entire shape.

It seems to me that you want to do something different. Essentially you want to use a LatheGeometry but with flexibel lateral contour definitions, right?

It’s best to create a new module for the new geometry class and then import it into your application code. Check out how the examples are implemented e.g. BoxLineGeometry.

1 Like

Thanks for the quick response, this helps a lot.

What I’m doing is interpolating between points as it sweeps round, and it currently assumes the same number of points in each array, and accepts any number of arrays, spacing them equally around the center. Obviously this breaks the rule of a lathe, but it was the easiest starting point for what I was trying to achieve. It’s more like a loft with a circular path, I’ve also seen it referred to as a swept blend in some 3D packages, again, with a circular path (the generic version allows any path)

I’ll create a module as you suggested and upload an example so people can have a play.

1 Like

:question: I’m not sure that can help.:question:

In my addon you can modify a lot of things.

Try it out: See also form library THREEf.js there.

Since it is open source, you can also change calculations according to your wishes.
hofk (Klaus Hoffmeister) · GitHub

1 Like


Your codepen is broken, I had to remove the orbitcontrols to get it working.

I’m building something quite similar, actually (another insect)

The other examples are interesting, it looks very flexible, though I’m having trouble figuring out how it works. I had a similar problem with the parametric geometry - you can create anything in theory, but figuring out the math for complex shapes isn’t very intuitive.

I really want to be able to create everything procedurally so everything is lightweight and easy to modify/animate, and I’m too slow with blender, and importing materials and animation is somewhat hit and miss. I have a lot of things to create/animate for a game, mostly creatures and scenery. The modified lathe will give me quite a few solutions to this, but I’m going to be creating a lot of procedural geometry with morph targets, so I’ll keep your work in mind.

I’ll upload some examples when I get this working.

1 Like

Thank you for pointing that out. This is a problem for me with the great dynamics of three.js and things like codepen. I can’t control all my examples all the time to notice something like this.

On my own page I keep the versions of three.js and additional scripts with version numbers. Then it works anyway and you can see if it works after upgrading to the current versions. If not, you have to make changes.

The bumblebee Mara with real bumblebee fur :

Figuring out how it works:

The calculations are central.
See THREEf.js/THREEf.js at b263d88d9b783b5dca4f5008e718997b6a3e75f0 · hofk/THREEf.js · GitHub the function xyzCalculation() at lines 2052 - 2246.

It is used for all variants (Geometry, indexed and non indexed BufferGeometry)
Fold the functions. Then you recognize the structure

Inside the function morphVertices( time ) at line 1994

Here’s my first attempt at creating a head, it’s a bit simple as it only uses 8 curves, but it’s a start:
Source is here:
I went with a class in the end as the rest of the project uses es6 classes, it works without modifying the main library, so I’m happy.

The bumblebee Mara with real bumblebee fur :

Haha very good. I see you’re using bones? I’m going to be going with morph targets for the face, and then code the limb movement myself. But it’s a lot of work. I want to avoid frame by frame animation and code as much as possible, it’s for a game so I want to be able to get a lot of different animations and then re-use them for other characters. I will probably do a bee at some point, though my style is a bit different (I am trying to follow the look of animated films like “the ant bully”)

I was trying to work out how to do a hair/fur effect - there was a website where they used several layers of geometry to get a really good hair effect, but it’s no longer live. You can see some screenshots and more info here:

My problem with any generative geometry is being able to take a target shape and work out what equations or variables you need to get there. Also, I think every new shape requires a different approach, I’m currently modelling limbs and head, which are kind of symmetrical with curves and should be easy enough to generate without having to model them by hand. The other solution I have seen is - which is quite similar to your work, and whilst it is very pretty, its very hard to predict what the geometry will look like

I repaired my codepens. :white_check_mark:

Some scripts (controls) were integrated via cloudflare. :boom:

:slightly_smiling_face: Now the bumblebee flies there again. :hibiscus: