Shelving - Three.js Demo 3D Application

Specify shelving dimensions, choose materials and check how it looks in your room. The application also calculates amounts of wood and prices.

Demo

Technologies

• WebGL
• Three.js

Features

1. The application has 2 view modes. In the "Environment" mode you can preview how your shelving looks inside a room.
2. Specify room size: height, width and length
3. Specify shelving dimensions: number of shelves, number of sections; width, length and thickness of shelves; shelving height, distance from floor to the lowest shelf, distance from top to the highest shelf
4. Choose from predefined set of materials
5. Calculate amounts of wood that you need to buy and prices.

Learning topics

1. Basic components of a Three.js scene: geometries, materials, meshes, groups, lights, cameras.
2. Debug tools: AxisHelper and fps stats.
3. Loading and working with external geometries and textures.
4. Using video texture

License

The Shelving Demo application is open-sourced software licensed under the MIT license (see LICENSE) and uses third party libraries and assets under their own terms (see LICENSE-3RD-PARTY).