Overview

3D LEGO Builder is an interactive web-based application that allows you to create and manipulate LEGO-style blocks in a 3D environment using Three.js and Cannon‑es for physics. The project is designed to be developer-friendly and easily extensible.

Instructions

1. Navigation: Use your mouse to orbit, zoom, and pan around the 3D scene.
2. Add a Block: Choose a block type from the dropdown menu, pick a color using the color picker, and click "Add Block" to add a new block to the scene.
3. Select & Rotate: Click on a block to select it. Then, use "Rotate Left" or "Rotate Right" to adjust its orientation.
4. Physics: Blocks are affected by physics—new blocks will fall onto the ground and interact with one another.

How the Code Works

The project is structured into several key parts:

• Scene Setup: Initializes the Three.js scene, camera, renderer, and OrbitControls.
• Physics Integration: Uses Cannon‑es to simulate realistic physics interactions between blocks.
• Data Loading: Fetches block definitions from a JSON file and populates the UI accordingly.
• User Interaction: Handles events like mouse clicks (for selection) and UI button clicks for adding or rotating blocks.
• Animation Loop: Continuously updates the scene and physics simulation, rendering each frame.