mirror of
https://github.com/troisjs/trois.git
synced 2024-11-24 04:12:02 +08:00
✨ ThreeJS + VueJS 3 + ViteJS ⚡
build | ||
screenshots | ||
src | ||
.eslintrc.js | ||
.gitignore | ||
.npmignore | ||
index.html | ||
package.json | ||
README.md | ||
rollup.config.js | ||
vite.config.js |
✨ ThreeJS + VueJS 3 + ViteJS ⚡
I wanted to code something similar to react-three-fiber but for VueJS.
- 💻 Examples (wip) : https://troisjs.github.io/ (sources)
- 📖 Doc (wip) : https://troisjs.github.io/guide/ (repo)
- 🚀 Codepen examples : https://codepen.io/collection/AxoWoz
I started from scratch, I will rewrite some of my WebGL demos to see if this little toy can do the job.
Trois is a french word, it means Three.
HMR
Thanks to VueJS/ViteJS, TroisJS use watchers and HMR to update ThreeJS objects when you update a template or a prop. This means the result in your browser will be automatically updated without reloading all the stuff. This is really helpful when you are creating a TroisJS Scene.
Features
- Lights
- AmbientLight
- DirectionalLight
- PointLight
- SpotLight
- ...
- Materials
- Basic
- Lambert
- Mapcat
- Phong
- Physical
- Standard
- SubSurface
- Toon
- ...
- Geometries
- Box
- Circle
- Cone
- Cylinder
- Dodecahedron
- Icosahedron
- Lathe
- Octahedron
- Polyhedron
- Ring
- Sphere
- Tetrahedron
- Torus
- TorusKnot
- Tube
- ...
- Post Processing
- EffectComposer
- BokehPass
- FilmPass
- FXAAPass
- HalftonePass
- Renderpass
- SMAAPass
- UnrealBloomPass
- ...
- EffectComposer
- ...