{"id":15646317,"url":"https://github.com/ticky/canvas-dither","last_synced_at":"2025-07-04T08:33:45.962Z","repository":{"id":2956526,"uuid":"3970652","full_name":"ticky/canvas-dither","owner":"ticky","description":"🖼 Simple demo of image processing in Javascript using HTML5 and Canvas","archived":false,"fork":false,"pushed_at":"2019-07-19T16:27:47.000Z","size":226,"stargazers_count":52,"open_issues_count":1,"forks_count":9,"subscribers_count":5,"default_branch":"gh-pages","last_synced_at":"2025-02-25T07:41:44.767Z","etag":null,"topics":["canvas","dithering","image-processing"],"latest_commit_sha":null,"homepage":"http://ticky.github.io/canvas-dither/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ticky.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2012-04-09T09:56:27.000Z","updated_at":"2024-12-17T12:12:36.000Z","dependencies_parsed_at":"2022-08-26T04:50:11.998Z","dependency_job_id":null,"html_url":"https://github.com/ticky/canvas-dither","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ticky%2Fcanvas-dither","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ticky%2Fcanvas-dither/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ticky%2Fcanvas-dither/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ticky%2Fcanvas-dither/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ticky","download_url":"https://codeload.github.com/ticky/canvas-dither/tar.gz/refs/heads/gh-pages","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242650896,"owners_count":20163610,"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":["canvas","dithering","image-processing"],"created_at":"2024-10-03T12:12:24.852Z","updated_at":"2025-03-09T05:30:30.115Z","avatar_url":"https://github.com/ticky.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Canvas Dither\n\n## Description\nSimple demo of image processing in Javascript using HTML5 and Canvas.\n\n## Recent Changes\n- Includes a timer for performance testing\n- Now able to dither/process each channel (R, G and B) separately, producing interesting effects\n- Now allows for choosing your own image to process\n- Moved processing to a Web Worker\n- Now able to output images in three different formats! (Assuming your browser supports it)\n- Renders to an `\u003cimg\u003e` element rather than just to a canvas\n- Can filter pixels using a simple threshold as well as Atkinson dithering (which, obviously, is what you're here for)\n\n## Future Plans\n- Create fallback for when web workers are not available\n- Enable drag-and-drop custom image selection\n- Improve compatibility\n- Probably going to re-style to look more like classic Mac OS (currently borrows a lot of design language and ideas from OS X, like [fractal-thing](https://github.com/geoffstokes/fractal-thing).)\n\n## Version History\n### v1.0\n- Full implementation of algorithm in main JS thread\n- Renders to an `\u003cimg\u003e` element\n\n### v2.0\n- Moved to Web Workers\n\n### v3.0\n- Allowed custom image uploads\n- Deal more effectively with large/broken/invalid images\n\n### v3.1\n- Enabled processing each channel separately, all required channels are processed in one pass\n- Tidied up some stuff, made JS create its canvas itself and render off screen\n- Added timers for performance testing\n\n## Notes\nTakes a lot of learned stuff from my [fractal-thing](https://github.com/ticky/fractal-thing) project (and improves on it significantly).\n\nExample image is by Keven Law, and [sourced from flickr](http://www.flickr.com/photos/kevenlaw/2308263346/). Image is licensed under Creative Commons Attribution-ShareAlike 2.0 Generic.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fticky%2Fcanvas-dither","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fticky%2Fcanvas-dither","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fticky%2Fcanvas-dither/lists"}