This is the official Khronos glTF 2.0 Sample Viewer using WebGL: glTF 2.0 Sample Viewer
Link to the live glTF 2.0 Sample Viewer.
click + drag
: Rotate model
scroll
: Zoom camera
GUI
: Use to change models and settings
- Choose one of the glTF models in the selection list
- Drag and drop glTF files into viewer
- Drag and drop a .hdr panorama file
For local usage and debugging, please follow these instructions:
-
Make sure Git LFS is installed.
-
Checkout the
main
branch -
Pull the submodule for the required glTF-Sample-Renderer
git submodule update --init --recursive
-
Build the web app
- run
npm install
- start a demo in the browser with
npm run dev
, and open http://localhost:8000.
- run
When making changes, the project is automatically rebuilt and the ./dist
directory is populated with the web app. This directory contains all files necessary for deployment to a webserver.
- Requirements
- Install the Debugger for Chrome or Debugger for Firefox extension for Visual Studio Code
- Open the project directory in Visual Studio Code and select
Debug->Add Configuration->Chrome
orDebug->Add Configuration->Firefox
so the.vscode/launch.json
file is created. - Append
/dist
to${workspaceFolder}
in thelaunch.json
file Debug->Start Debugging
should now launch a Chrome or Firefox window with the sample viewer and VS Code breakpoints should be hit.
npm install give the following warning:
npm WARN deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
npm WARN deprecated source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated
npm WARN deprecated glob@7.2.3: Glob versions prior to v9 are no longer supported
These warnings come from rollup plugins copy and sourcemaps, both are dev dependencies and not used in the final distribution.
Sourcemap is used to make debugging of @khronosgroup/gltf-viewer possible.
Copy is used to copy all required files to dist.