College 3D Model Rendering using ThreeJs is a system that allows a user to virtually visit our college K. J. Somaiya Institute of Engineering and Information Technology Sion, Ayurvihar, Mumbai. to gain an understanding of its infrastructure, thereby broadening the prospect pool to users who might not have been able to afford an in-person visit to the physical campus.
This system would be made available via Website, which will comprise a complete infrastructure of the college virtually.
The users of the system would be able to navigate the college 3D model with a first perspective view of the exterior campus including a zoom in and out function that can be used to proceed through the tour with a focus on particular areas of interest. The system also includes the interiors of the campus and its amenities such as auditorium, library, labs, classrooms, etc.
K. J. Somaiya Institute of Engineering and Information Technology was established by the Somaiya Trust in the 2001, at Ayurvihar campus, Sion, Mumbai, India. It is an autonomous institute affiliated to the University of Mumbai.
College Infrastructure 3D Navigation hosted on free Firebase server. For
-
reactis a free and open-source front-end JavaScript library for building user interfaces based on UI components. It is maintained by Meta (formerly Facebook). -
three.jsis an open source JavaScript library that is used to display the graphics, 3D and 2D objects on the web browser. It uses WebGL API behind the scene. Three.js allow you to use your GPU(Graphics Processing Unit) to render the Graphics and 3D objects on a canvas in the web browser. -
react-three-fiberis a React renderer for threejs. -
react-three-dreicontains useful helpers for react-three-fiber. -
Blenderis a free and open-source 3D computer graphics software tool set used for creating animated films, visual effects, art, 3D printed models, motion graphics, interactive 3D applications, virtual reality, and computer games.
:star: All the 3d models used in the project are created using Blender software with .glb file format.
❓ Why use GLB file format
- It is incredibly lightweight. A .glb file with a size of 7 MB can easily reach a size of 37 MB or more with another extension.
- The GLB file locates all of the elements, including animations, materials, node hierarchy and cameras in one single file.