A 3D renderer which enables out-of-the-box build to both desktop (Rust + OpenGL) and web (Rust to WebAssembly + WebGL2). This makes it possible to develop a 3D application on desktop and easily deploy it on web!
Chrome, Firefox, Edge and Safari (Safari requires enabling the "WebGL 2.0" experimental feature).
Several examples covering most features can be found here and the examples from the latest release are also live at asny.github.io/three-d/. Take a look at the triangle example for a gentle introduction.
| Feature | Description | Examples | [features] |
|---|---|---|---|
| Context | Thin and low-level graphics abstraction layer which maps one-to-one with the OpenGL/WebGL2 graphics APIs. | ||
| Graphics concepts | Modular abstractions of common graphics concepts such as buffer, texture, program and render target. | ||
| Camera | Orthographic and perspective camera which has functionality for navigation and frustum culling queries. | Mandelbrot, Statues, Fireworks | |
| Light | Light definitions which is put in a uniform buffer. Currently implemented light types are ambient light, directional light, spot light and point light. Directional and spot lights has functionality for shadow mapping. | Statues, Lighting, Wireframe | |
| Mesh | A triangle mesh object with fixed vertex shader and customizable fragment shader for customizable lighting. Supports rendering the depth and also with a fixed color and with a texture (ie. no lighting). | Triangle, Mandelbrot | |
| Instanced mesh | Similar to Mesh, except it is possible to draw many instances of the same triangle mesh efficiently. | Wireframe, Fireworks, Forest | |
| Skybox | An illusion of a sky. | Texture, Fog | |
| Particles | Particle effect with fixed vertex shader and customizable fragment shader. | Fireworks | |
| Imposters | A level-of-detail technique to replace rendering high-poly meshes at a distance. A mesh is rendered from different angles into a set of textures and the textures are then rendered continuously instead of the high-poly meshes. | Forest | |
| Image effect | A customizable effect applied to each pixel of a render target, for example fog or anti-aliasing. | Fog | |
| Phong renderer | Rendering functionality based on the phong reflection model supporting a performance-limited amount of directional, point and spot lights with shadows. | Statues, Lighting, Wireframe | phong-renderer |
| Runtime loading | Loading any type of asset runtime on both desktop and web. | Statues, Forest, Texture | |
| 3D model parsers | Built-in parsers for .obj (using the wavefront-obj crate) and .3d files (a custom format). | Statues, Forest, Texture | 3d-io obj-io |
| Image parsers | Most image formats are supported (using the image crate). | Texture, Statues | image-io |
| GUI | Immidiate mode GUI support using the egui crate. | Lighting | egui-gui |
| Window | Default windows for easy setup and event handling. Currently glutin for cross-platform desktop and canvas for web. | All | glutin-window canvas |
It is always possible to combine features, for example rendering particles followed by direct calls to the graphics context.
Build and run an example, in this case 'triangle':
$ cargo run --example triangle --releasePrerequisites:
- A server that properly defines the
application/wasmmime type (for example http-server) - wasm-pack
Build and generate web output (webassembly, javascript and html files) into the pkg folder:
$ wasm-pack build examples/triangle --target web --out-name web --out-dir ../../pkgStart the server and go to http://localhost:8080 in a browser:
$ http-serverFeature requests and bug reports are more than welcome, just open an issue or start a discussion. Contributions are highly appreciated, please feel free to reach out or simply create a pull request.