TV Stand configurator object

Hello All,

I want to create similar kind of stretchable object. Please check below URL.

You can increase or decrease height and width then object will automatically increased or decreased according to the selection.

Can you please check and let me know how it would be feasible?

Thanks in advance.

Fundamentally you’ve three possible approaches. You can do it with meshes, in geometry, or via shader. Now in the case of adding and removing shelves as per the demo site; that’s not (realistically) possible in a shader because web_gl does not have geometry shaders (I say realistically, because there’s a way of doing shell shaders but honestly its the wrong approach here).

So you’re going to want to modify the geometry or to build the object out of primitive shapes (in this case cubes).

If you are recreating the page in question, then personally I would do it with adding geometry at the vertex level; however if you are new to threeJs you’d probably find it easier by adding primitive shapes.

If doing it with primitives you’d probably just make your code so that each time a change is made you reconstruct the object from fresh. That’s going to be a lot simpler than rescaling things on the fly.