Skip to content

This project utilizes Three.js to build an interactive 3D grid environment. Users can generate and delete objects on the grid by clicking. Objects rotate, and the camera perspective is adjustable. It's a dynamic, visually engaging experience.

Notifications You must be signed in to change notification settings

ankitjha2603/create-element-on-grid

Repository files navigation

Interactive 3D Grid Environment

This project leverages the power of Three.js to create an interactive 3D grid environment where users can generate and delete objects with mouse interactions.

Features

  • 3D Grid: A grid pattern serves as the base for object placement and interaction.
  • Cursor Interaction: Mouse movement highlights grid squares, providing visual cues.
  • Object Generation: Double-clicking adds rotating diamond-like objects to the grid.
  • Object Deletion: Right-clicking removes previously placed objects.
  • Continuous Animation: Objects rotate smoothly to enhance visual appeal.
  • Camera Control: Adjust the camera perspective with intuitive mouse controls.
  • Responsive Design: The scene adapts seamlessly to window resizing.

Usage

  1. View project on You can experience the project live here.
  2. Hover over the grid to highlight squares.
  3. Double-click to create rotating objects.
  4. Right-click to remove objects.
  5. Explore the scene by adjusting the camera with mouse controls.

View Project

You can experience the project live here.

Dependencies

  • Three.js (Included in the project)

About

This project utilizes Three.js to build an interactive 3D grid environment. Users can generate and delete objects on the grid by clicking. Objects rotate, and the camera perspective is adjustable. It's a dynamic, visually engaging experience.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published