{"id":13307256,"url":"https://github.com/Tw1ddle/WebGL-Distance-Fields","last_synced_at":"2025-03-10T14:32:44.019Z","repository":{"id":150404181,"uuid":"49014782","full_name":"Tw1ddle/WebGL-Distance-Fields","owner":"Tw1ddle","description":":star: Realtime Euclidean distance field generation and rendering","archived":false,"fork":false,"pushed_at":"2021-12-13T21:41:33.000Z","size":6607,"stargazers_count":63,"open_issues_count":0,"forks_count":12,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-03-05T06:36:13.186Z","etag":null,"topics":["distance-fields","distance-measures","glsl","haxe","sdf","shaders","signed-distance-field","webgl","webgl-distance-fields"],"latest_commit_sha":null,"homepage":"https://samcodes.co.uk/code/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Tw1ddle.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-01-04T18:22:02.000Z","updated_at":"2024-08-29T02:59:54.000Z","dependencies_parsed_at":"2023-04-25T16:19:22.392Z","dependency_job_id":null,"html_url":"https://github.com/Tw1ddle/WebGL-Distance-Fields","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tw1ddle%2FWebGL-Distance-Fields","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tw1ddle%2FWebGL-Distance-Fields/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tw1ddle%2FWebGL-Distance-Fields/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tw1ddle%2FWebGL-Distance-Fields/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Tw1ddle","download_url":"https://codeload.github.com/Tw1ddle/WebGL-Distance-Fields/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242868621,"owners_count":20198517,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["distance-fields","distance-measures","glsl","haxe","sdf","shaders","signed-distance-field","webgl","webgl-distance-fields"],"created_at":"2024-07-29T18:00:15.523Z","updated_at":"2025-03-10T14:32:44.005Z","avatar_url":"https://github.com/Tw1ddle.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![Project logo](screenshots/webgl_distance_fields_logo.png?raw=true \"WebGL Distance Fields Logo\")\n\n[![License](https://img.shields.io/:license-mit-blue.svg?style=flat-square)](https://github.com/Tw1ddle/WebGL-Distance-Fields/blob/master/LICENSE)\n[![Build Status Badge](https://ci.appveyor.com/api/projects/status/github/Tw1ddle/WebGL-Distance-Fields)](https://ci.appveyor.com/project/Tw1ddle/WebGL-Distance-Fields)\n\nFast Euclidean distance field generation and rendering demo. Run it [in the browser](https://tw1ddle.github.io/WebGL-Distance-Fields/).\n\n## Usage\n\nThe 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.\n\n[![Screenshot](https://github.com/Tw1ddle/WebGL-Distance-Fields/blob/master/screenshots/realtime.gif?raw=true \"WebGL Distance Fields Realtime Screenshot\")](https://tw1ddle.github.io/WebGL-Distance-Fields/)\n\n## How It Works\n\nThe technique is based on Chapter 12 of [OpenGL Insights](https://openglinsights.com/) by Stefan Gustavson. Refer to the [generator code](https://github.com/Tw1ddle/WebGL-Distance-Fields/blob/master/sdf/generator/SDFMaker.hx), shaders and [readme](https://github.com/Tw1ddle/WebGL-Distance-Fields/tree/master/sdf).\n\nAnti-aliased input (128x128):\n\n![Screenshot](https://github.com/Tw1ddle/WebGL-Distance-Fields/blob/master/screenshots/screenshot1.png?raw=true \"WebGL Distance Fields Screenshot 1\")\n\nOutput rendered at (~700x700):\n\n![Screenshot](https://github.com/Tw1ddle/WebGL-Distance-Fields/blob/master/screenshots/screenshot2.png?raw=true \"WebGL Distance Fields Screenshot 2\")\n\n## Notes\n* The demo was inspired by Paul Houx's [text rendering sample](https://github.com/paulhoux/Cinder-Samples) for Cinder.\n* Written using [Haxe](https://haxe.org/) and [three.js](https://threejs.org/).\n* Uses the actuate and Sure [haxelibs](https://lib.haxe.org/).\n\n## License\n * The distance field shaders are in the public domain. The rest of the code is provided under the MIT license, unless noted otherwise.\n * Got an idea or suggestion? Open an issue on GitHub, or send Sam a message on [Twitter](https://twitter.com/Sam_Twidale).","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTw1ddle%2FWebGL-Distance-Fields","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FTw1ddle%2FWebGL-Distance-Fields","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTw1ddle%2FWebGL-Distance-Fields/lists"}