A simply fabulous pano-based 3D-Viewer
This project is designed to enable the computer science department of the Friedrich-Alexander University Erlangen-Nuremberg to display its 50 years computer science department exhibition online. This 3D Viewer web application can be easily accessed via https://50-jahre-informatik.cs.fau.de.
The software to be developed shall be able to:
● View arbitrary rooms based on a 3D model\ ● Allow users to walk through these rooms
Properties
Functional properties of the software shall be:
● The panorama shall be scalable (within a window)\ ● Users should be able to\ ○ Rotate the panorama\ ○ Walk through a room (switches panoramas)\ ○ Switch between rooms\ ○ Switch between floors (levels)\ ● A room layout including the user’s location shall be available
Non-functional properties of the software shall be:
● Runs in most common browsers (hence Javascript/Typescript)\ ● Speedy non-frustrating interaction possible\ ● Can be integrated into other web applications
The computer science department would like to use this viewer to display its 50 years of computer science department exhibition on the web.
3D Panorama Viewer | AMOS Project 5
Software Build and Deployment Document
Project Repository
Github organisation structure
base folder: /main:
-
/deliverables: textual deliverables, i.e. documents (pdf, doc, etc.), or software deliverables
-
/src: stands for source, and is the raw code before minification or concatenation or some other compilation - used to read/edit the code
-
/gitignore: is a text file that tells Git which files or folders to ignore in a project
-
/license: MIT License A short and simple permissive license with conditions only requiring preservation of copyright and license notices. Licensed works, modifications, and larger works may be distributed under different terms and without source code.
Folder Structure
base folder: /src: Frontend
It includes css(inside PanoViewer div),js,libs and index.html
-
/src/js/viewer: includes the general viewer files
-
/src/libs: includes jQuery, OpenLayers and Three.js Library files
Folder Structure
base folder: /src: Backend
Includes the js files and main.js
Bill of Material
-
Node.js: JavaScript runtime environment Backend
-
the three.js NPM package: JavaScript library and API for animated 3D graphics
-
WebGL Overview - The Khronos Group Inc: JavaScript API for rendering interactive 2D and 3D graphics
-
License | jQuery Foundation: JavaScript library for simple HTML DOM manipulation
-
OpenLayers: JavaScript library for displaying a dynamic map and markers on it
You can find further details about the project in the associated documents.