- Notifications
You must be signed in to change notification settings - Fork12
⭐ Realtime Euclidean distance field generation and rendering
License
NotificationsYou must be signed in to change notification settings
Tw1ddle/WebGL-Distance-Fields
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Fast Euclidean distance field generation and rendering demo. Run itin the browser.
The demo performs realtime distance field generation from text drawn on a HTML5 canvas. Type something to add letters, hit backspace or delete to remove letters, use mousewheel to zoom.
The technique is based on Chapter 12 ofOpenGL Insights by Stefan Gustavson. Refer to thegenerator code, shaders andreadme.
Anti-aliased input (128x128):
Output rendered at (~700x700):
- The demo was inspired by Paul Houx'stext rendering sample for Cinder.
- Written usingHaxe andthree.js.
- Uses the actuate and Surehaxelibs.
- The distance field shaders are in the public domain. The rest of the code is provided under the MIT license, unless noted otherwise.
- Got an idea or suggestion? Open an issue on GitHub, or send Sam a message onTwitter.