Spaces:
Running
Running
Update README.md
Browse files
README.md
CHANGED
|
@@ -13,107 +13,11 @@ pinned: false
|
|
| 13 |
|
| 14 |
# gsplat.js
|
| 15 |
|
| 16 |
-
|
| 17 |
|
| 18 |
-
|
|
|
|
|
|
|
|
|
|
| 19 |
|
| 20 |
-
### Quick Start
|
| 21 |
|
| 22 |
-
- **Live Viewer Demo:** Explore this library in action in the 🤗 [Hugging Face demo](https://huggingface.co/spaces/dylanebert/igf). Note: May not work on all devices; use `Bonsai` for the lowest memory requirements.
|
| 23 |
-
- **Editor Demo:** Try new real-time updates and editing features in the [gsplat.js editor](https://huggingface.co/spaces/dylanebert/gsplat-editor).
|
| 24 |
-
- **Code Example:** Start coding immediately with this [jsfiddle example](https://jsfiddle.net/wdn6vasc/).
|
| 25 |
-
|
| 26 |
-
### Installation
|
| 27 |
-
|
| 28 |
-
**Prerequisites**: Ensure your development environment supports ES6 modules.
|
| 29 |
-
|
| 30 |
-
1. **Set Up a Project:** (If not already set up)
|
| 31 |
-
|
| 32 |
-
Install [Node.js](https://nodejs.org/en/download/) and [NPM](https://www.npmjs.com/get-npm), then initialize a new project using a module bundler like [Vite](https://vitejs.dev/):
|
| 33 |
-
|
| 34 |
-
```bash
|
| 35 |
-
npm create vite@latest gsplat -- --template vanilla-ts
|
| 36 |
-
```
|
| 37 |
-
|
| 38 |
-
2. **Test Your Environment:**
|
| 39 |
-
|
| 40 |
-
```bash
|
| 41 |
-
cd gsplat
|
| 42 |
-
npm install
|
| 43 |
-
npm run dev
|
| 44 |
-
```
|
| 45 |
-
|
| 46 |
-
3. **Install gsplat.js:**
|
| 47 |
-
|
| 48 |
-
```bash
|
| 49 |
-
npm install --save gsplat
|
| 50 |
-
```
|
| 51 |
-
|
| 52 |
-
### Usage
|
| 53 |
-
|
| 54 |
-
#### Creating a Scene
|
| 55 |
-
|
| 56 |
-
- Import **gsplat.js** components and set up a basic scene.
|
| 57 |
-
- Load Gaussian Splatting data and start a rendering loop.
|
| 58 |
-
|
| 59 |
-
(in `src/main.ts` if you followed the Vite setup)
|
| 60 |
-
|
| 61 |
-
```js
|
| 62 |
-
import * as SPLAT from "gsplat";
|
| 63 |
-
|
| 64 |
-
const scene = new SPLAT.Scene();
|
| 65 |
-
const camera = new SPLAT.Camera();
|
| 66 |
-
const renderer = new SPLAT.WebGLRenderer();
|
| 67 |
-
const controls = new SPLAT.OrbitControls(camera, renderer.canvas);
|
| 68 |
-
|
| 69 |
-
async function main() {
|
| 70 |
-
const url = "https://huggingface.co/datasets/dylanebert/3dgs/resolve/main/bonsai/bonsai-7k.splat";
|
| 71 |
-
|
| 72 |
-
await SPLAT.Loader.LoadAsync(url, scene, () => {});
|
| 73 |
-
|
| 74 |
-
const frame = () => {
|
| 75 |
-
controls.update();
|
| 76 |
-
renderer.render(scene, camera);
|
| 77 |
-
|
| 78 |
-
requestAnimationFrame(frame);
|
| 79 |
-
};
|
| 80 |
-
|
| 81 |
-
requestAnimationFrame(frame);
|
| 82 |
-
}
|
| 83 |
-
|
| 84 |
-
main();
|
| 85 |
-
```
|
| 86 |
-
|
| 87 |
-
This script sets up a basic scene with Gaussian Splatting data loaded from URL and starts a rendering loop.
|
| 88 |
-
|
| 89 |
-
### FAQ
|
| 90 |
-
|
| 91 |
-
**Q: Can I use .ply files?**
|
| 92 |
-
|
| 93 |
-
A: Yes, gsplat.js supports `.ply` files. See the [ply-converter example](https://github.com/dylanebert/gsplat.js/blob/main/examples/ply-converter/src/main.ts) for details on how to convert `.ply` to `.splat`. Alternatively, convert PLY files from URL in this [jsfiddle example](https://jsfiddle.net/2sq3pvdt/1/).
|
| 94 |
-
|
| 95 |
-
**Q: What are .splat files?**
|
| 96 |
-
|
| 97 |
-
A: `.splat` files are a compact form of the splat data, offering quicker loading times than `.ply` files. They consist of a raw Uint8Array buffer.
|
| 98 |
-
|
| 99 |
-
> ⚠️ The `.splat` format does not contain SH coefficients, so colors are not view-dependent.
|
| 100 |
-
|
| 101 |
-
**Q: Can I convert .splat files to .ply?**
|
| 102 |
-
|
| 103 |
-
A: Yes, see the commented code in the [ply-converter example](https://github.com/dylanebert/gsplat.js/blob/main/examples/ply-converter/src/main.ts). Alternatively, convert `.splat` to `.ply` from URL in this [jsfiddle example](https://jsfiddle.net/aL81ds3e/).
|
| 104 |
-
|
| 105 |
-
> ⚠️ When converting `.ply` -> `.splat` -> `.ply`, SH coefficients will be lost.
|
| 106 |
-
|
| 107 |
-
### License
|
| 108 |
-
|
| 109 |
-
This project is released under the MIT license. It is built upon several other open-source projects:
|
| 110 |
-
|
| 111 |
-
- [three.js](https://github.com/mrdoob/three.js), MIT License (c) 2010-2023 three.js authors
|
| 112 |
-
- [antimatter15/splat](https://github.com/antimatter15/splat), MIT License (c) 2023 Kevin Kwok
|
| 113 |
-
- [UnityGaussianSplatting](https://github.com/aras-p/UnityGaussianSplatting), MIT License (c) 2023 Aras Pranckevičius
|
| 114 |
-
|
| 115 |
-
Please note that the license of the original [3D Gaussian Splatting](https://github.com/graphdeco-inria/gaussian-splatting) research project is non-commercial. While this library provides an open-source rendering implementation, users should consider the source of the splat data separately.
|
| 116 |
-
|
| 117 |
-
### Contact
|
| 118 |
-
|
| 119 |
-
Feel free to open issues, join the [Hugging Face Discord](https://hf.co/join/discord), or email me directly at [[email protected]](mailto:[email protected]).
|
|
|
|
| 13 |
|
| 14 |
# gsplat.js
|
| 15 |
|
| 16 |
+
This library is an update version of Dylan Ebert library (https://github.com/huggingface/gsplat.js).
|
| 17 |
|
| 18 |
+
Pour la mettre à jour :
|
| 19 |
+
- modifier les scripts dans /src en local
|
| 20 |
+
- dans le terminal gitbash, aller dans /emsdk et faire npm run build
|
| 21 |
+
- téléverser les fichiers modifiés dans src et leur versions dans dist sur le space
|
| 22 |
|
|
|
|
| 23 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|