MrZenW / threejs-model-viewer

An application using the Three.js library to allow user to load model files and view them online with multiple viewing options.

Home Page:https://adjam93.github.io/threejs-model-viewer/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Three.js-Model-Viewer

An application using the Three.js library to allow user to load model files and view them online with multiple viewing options.

Loading Models:

  • Choice of inputs, either load model or load model + textures

  • Models and textures can be dragged and dropped onto the viewer

  • Current formats supported: .obj or obj+mtl(and textures), .dae or dae (+textures), .stl, GLTF (+textures) and FBX (+textures)

  • If loading a model and textures, make sure the model file and texture files are in the same folder on your system

Features:

  • View sample models from dropdown list
  • View model information (name of model, number of vertices and faces)
  • Add ambient light and alter the colour
  • Alter the colour of the directional Ligt
  • View model in wireframe model and model+wireframe mode
  • Apply phong shading mode and increase/decrease the shininess level
  • View model in x-ray
  • Apply glow outline pass to the model and set the edge colour of the glow
  • Set background colour of the renderer
  • Auto-rotate the model and adjust the rotation speed
  • Add transform controls (when selected, press S:scale, T:translate and R:rotate)
  • Scale the model up and down
  • Add view helpers such as bounding box, square/circular grid underneath model and an axis

Potential Features:

  • Support morph targets
  • ZIP file support

View the Project Online

About

An application using the Three.js library to allow user to load model files and view them online with multiple viewing options.

https://adjam93.github.io/threejs-model-viewer/


Languages

Language:JavaScript 97.7%Language:CSS 1.3%Language:HTML 1.1%