3D Rotating Cube on Canvas

This code demonstrates how to create and rotate a 3D cube within a 2D canvas using JavaScript. The cube rotates around its X, Y, and Z axes to give a simple 3D effect.

Overview

This code example showcases the creation and rotation of a 3D cube in a 2D canvas. The cube is defined using a custom Cube3d class, and it is positioned at the center of the canvas. The cube continuously rotates in all three dimensions, resulting in an engaging visual effect.

Screenshots

Features and Customization

• The cube is positioned at the center of the canvas, creating a visually pleasing effect.
• The cube continually rotates in three dimensions, enhancing the illusion of depth.
• Adjusting the rotation angles in the loop function can alter the rotation speed and behavior of the cube

Usage

git clone https://github.com/sidx2/cube3d.js

cd cube3d.js

Open the index.html file in your favourite browser