Various experiments and examples using WebGL in Elm.
Elm Town animated logo based on the original design by Maggie Appleton. I traced the logo in 3D in Blender, loaded with elm-obj-file, rendered with elm-3d-scene and then animated with elm-animator.
Elm Game Jam #5 logo rendering, designed by @kuzminadya. Uses:
- elm-obj-file to load the "3D" mesh, that was created in Blender
- one-true-path-experiment to parse the SVG path and elm-geometry and elm-triangular-mesh to generate the tube-shaped mesh of the lettering
- Rendered with elm-3d-scene
Real-time shadows using the shadow volume technique. Collaboration with Ian Mackenzie that ended up integrated into elm-3d-scene.
A demo similar to Oslo Elm Day 2019, but implemented in Elm instead of Three.js.
Draws a circle in the fragment shader.
Renders the shader code from https://www.shadertoy.com/view/Ms2SD1 using Elm WebGL.
Mixes WebGL and DOM layers in one common 3D space.
The front face of the cube is rendered with a transparent color. This makes a part of the canvas transparent so the DOM element can be seen through it.
Native module had to be used in order to extract the values from Mat4
.
Elm tangram pieces in 3D, composing different logos of Elm-related projects.
I found a copter model, that we had modeled together with a schoolmate using just pen and paper when we were kids back in 2002. This used to be rendered with Direct3D in Visual Basic. I converted the model into Elm and WebGL.
Generates a planet with randomized surface. In this demo I also tried to add lightning to the scene.
I couldn't find any simple example of how to render 2D with WebGL and Elm, so I decided to create this myself.
This renders an animated object at the mouse position:
Special thanks to Kolja for the awesome illustration. Please check our WebGL game Elm Street 404.
- Install elm elm-lang.org/install
- Clone this repo and
cd
into it - Run
elm reactor
- Open localhost:8000 in the browser