How to modify the shape of a geometry?

I’m very new to three.js and trying to make a bottle dynamically using three.js. I’m thinking about two methods.

  1. Create a cylinder. Scale or shrink around part of the cylinder dynamically and make it looks like a bottle.
  2. Draw a curved line and use lathegeometry method to generate the bottle.

And you can try both of them.

The second option will be easier.

However if you want to add any kind of realism to your bottle then you’ll have to take the third option: use modelling software such as blender, clara.io, 3ds max etc etc.

The ability to model things in three.js is very limited compared to these programs since modelling is not the purpose of the library.

1 Like

But the first one is more fun :slight_smile:

1 Like

In most cases i recommend modelling software since most geometry generators have a very limited feature set (for good reasons). Especially inexperienced three.js users often expect too much magic of these entities and then get stuck. They should only work with procedural geometries if they know what’s happening under the hood. At least somewhat…

1 Like

What I’m trying to do is to make a simple web app that customers can make their own special bottle. I don’t know which one is the best option.

Try to start with the second option and see how good it works for your use case.

When I started out with three.js, I didn’t make a bottle, I made a bumblebee.
I used both methods.

see under https://codepen.io/hofk/pen/eWdZMb

20180224-1723-38901

4 Likes

Thank you. I’ll give it a try.

@hofk Sweat :blush:

that’s awesome.

Looks like most of beginners tried to deform Three.js’s basic primitives :smile: :beers:
http://west77.ru/content/r73/hyper.html
The space ship is just a very deformed sphere.
Deform_the_sphere

1 Like

I guess that’s natural.
This looks great.

And I can read the phrase in all three languages! Although my Russian is certainly worse than my English! :confused: