Reall3dViewer
This is a 3DGS(3D Gaussian Splatting) viewer built on Three.js, with features for marking, measurements, preset-lod rendering, etc.
Install / Use
/learn @reall3d-com/Reall3dViewerREADME
Reall3dViewer
Reall3dViewer is a 3D Gaussian Splatting viewer built on Three.js. Crafting an exceptional 3DGS viewer is no small feat, which is why we've chosen to open-source our project. We hope to harness the collective wisdom and efforts of the community to drive the advancement of 3DGS applications together!
Features
- [x] Support formats:
.ply,.splat,.spx,.spz(v2+),.sog(v1,v2),.glb(with KHR_gaussian_splatting extension) - [x] Support mark and measurement tools
- [x] Support 1st to 3rd degree spherical harmonics
- [x] Support map-integrated model rendering
- [x] Support per-model settings via
*.meta.jsonfile - [x] Built-in rendering quality levels with adaptive optimization (v2.0.0+ 🌟)
- [x] Built-in optimized sorting types to fine-tune performance for diverse scenarios (v2.0.0+ 🌟)
- [x] Support large-scene rendering using preset LOD (v2.4.0+ 🌟)
Live demo
- https://reall3d.com/reall3dviewer/index.html
Docs(By Zread AI)
- https://zread.ai/reall3d-com/Reall3dViewer
Key Configuration Parameters
| Name | Note |
|------------------------------|------------------------------------|
| maxRenderCountOfMobile | Low-end devices have rendering limits. Adjust from default if needed. Recommended. |
| maxRenderCountOfPc | High-end devices also have rendering limits. Adjust from default if needed. Recommended. |
| qualityLevel | Choose based on target device and model for optimal performance/quality. Adaptive adjustment supported. Recommended. |
| sortType | No single algorithm is optimal for all scenarios. Choose the most suitable one from built-in types for your case. Recommended. |
.spx
- Format Specification: https://github.com/reall3d-com/Reall3dViewer/blob/main/SPX_EN.md
- Conversion Tool: https://github.com/gotoeasy/gsbox
Basic Usage
use source code
# develop
npm run dev
# build
npm run build
# open a web browser to render your 3dgs model
# http://hostname:port/index.html?url=your-model-link-address
# .spx or .sog file can be obtained through conversion using the gsbox
gsbox ply2sog -i /path/to/input.ply -o /path/to/output.sog
gsbox sog2spx -i /path/to/input.ply -o /path/to/output.spx
use npm package sample project here
# install
npm install @reall3d/reall3dviewer
# use built-in viewer
const viewer = new Reall3dViewer({ root: '#gsviewer' });
viewer.addModel(`https://reall3d.com/demo-models/yz.spx`);
# preset-lod rendering
const viewer = new Reall3dViewer({ root: '#gsviewer' });
viewer.addScene(`https://reall3d.com/demo-models/lod-v1/hgd/hgd-lod.scene.json`);
# use splat mesh
const splatMesh = new SplatMesh({ renderer, scene, controls});
splatMesh.addModel({ url: 'https://reall3d.com/demo-models/yz.spx' });
scene.add(splatMesh);
Release History
https://github.com/reall3d-com/Reall3dViewer/releases
Acknowledgments
We would like to express our gratitude to the following projects for their valuable reference implementations
- https://github.com/antimatter15/splat
- https://github.com/mkkellogg/GaussianSplats3D
- https://github.com/huggingface/gsplat.js
- https://github.com/playcanvas/supersplat
- https://github.com/sxguojf/three-tile
Contact
Feel free to submit an issue on the project page. Our commercial version offers a 3DGS model format optimization tool and supports embedding watermarks to protect model ownership. Please don't hesitate to contact us.
- Site: https://reall3d.com
