This manual covers the basic introduction of setting up 3d viewers, configurators, and online experiences using the
webgi engine. It explains basic concepts and covers many common use-cases and examples.
- Viewer API Getting Started
- Plugins Basics
- Asset Management
- Camera control and Animation
- GLTF Animations
- Picking and Interactions
- Popmotion Animation/Tween
- 3D Model Preparation
- Anti-Aliasing (SSAA, TAA, Scaling)
- Scrollable 3d websites
- Ground/Floor Setup and Shadows
- Extending with three.js
- Writing custom plugins
- Material Configurators
- Post Processing and HDR Pipeline
- Object Configurators
- Object Import processors
The SDK code is available at the below links. Since the library is in constant development, the version is updated frequently, make sure to update to the latest from time to time.
The scripts and assets are hosted on Google cloud with Cloudflare CDN to give fast import directly on the websites.
Direct JS import
For use in HTML/JS files
- Module Bundle:
To add in
- JS Bundle:
- Type Declarations:
See Installation page for more details
The latest version of the SDK is available can be found in the top right corner of this documentation website.
CORS issues with links
There are some
Cross-Origin Resource Sharing (CORS) rules set to prevent abuse with assets.
When working locally, use port
https://localhost. For online development, CodePen and CodeSandbox are allowed.
If you are facing a CORS issue on production, contact us.
The SDK and pre-built files can be accessed from the above links.
Contact us for source code access and developer support.
To use the viewer in a production environment, contact us for a license.
The Viewer SDK is closed-source at the moment, we may choose to make it open at a later date. Some parts of the viewer are open-source and can be found on Github.
Contact and support
Join our new discord server to chat, ask questions, report bugs, suggest features/improvements or to just hang out.
Join Now: https://discord.gg/apzU8rUWxY
and don't forget to introduce yourself.
Contact details for high priority developer support, partnerships, licensing questions or business queries.