{"id":16758141,"url":"https://github.com/foo123/canvaslite","last_synced_at":"2025-08-23T01:39:35.468Z","repository":{"id":184795338,"uuid":"672455026","full_name":"foo123/CanvasLite","owner":"foo123","description":"A lite html canvas implementation in pure JavaScript","archived":false,"fork":false,"pushed_at":"2025-07-06T11:15:23.000Z","size":311,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-07-06T12:25:19.446Z","etag":null,"topics":["canvas"],"latest_commit_sha":null,"homepage":"","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/foo123.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,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2023-07-30T06:23:30.000Z","updated_at":"2025-07-06T11:14:55.000Z","dependencies_parsed_at":"2025-07-06T12:22:11.316Z","dependency_job_id":"8ed26ce2-6841-4798-a782-c38ba731a41a","html_url":"https://github.com/foo123/CanvasLite","commit_stats":null,"previous_names":["foo123/canvaslite"],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/foo123/CanvasLite","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foo123%2FCanvasLite","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foo123%2FCanvasLite/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foo123%2FCanvasLite/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foo123%2FCanvasLite/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/foo123","download_url":"https://codeload.github.com/foo123/CanvasLite/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/foo123%2FCanvasLite/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":271731364,"owners_count":24811300,"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","status":"online","status_checked_at":"2025-08-22T02:00:08.480Z","response_time":65,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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"],"created_at":"2024-10-13T04:04:16.869Z","updated_at":"2025-08-23T01:39:35.463Z","avatar_url":"https://github.com/foo123.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# CanvasLite\n\nA lite html canvas implementation in pure JavaScript\n\n**version: 1.0.1** (78 kB minified)\n\n**Uses:**\n\n1. [Gradient](https://github.com/foo123/Gradient)\n2. [Rasterizer](https://github.com/foo123/Rasterizer)\n\n**What is not supported:**\n\n1. `strokeText`/`fillText`/`measureText` ..  (will **not** be implemented but can be done by drawing the actual curves in the font)\n\n**test/demo:**\n\n```js\nconst CanvasLite = require(__dirname + '/../build/CanvasLite.js');\n// colorful peace sign\nconst canvas = new CanvasLite(300, 300);\nconst ctx = canvas.getContext('2d');\nconst gradient = ctx.createLinearGradient(20, 20, 180, 180);\ngradient.addColorStop(0.0, 'red');\ngradient.addColorStop(0.33, 'yellow');\ngradient.addColorStop(0.66, 'green');\ngradient.addColorStop(1.0, 'blue');\nctx.strokeStyle = gradient;\nctx.lineWidth = 21;\nctx.beginPath();\nctx.arc(125, 125, 106, 0, 2*Math.PI);\nctx.closePath();\nctx.moveTo(125, 19);\nctx.lineTo(125, 19+212);\nctx.moveTo(125, 125);\nctx.lineTo(125-75, 125+75);\nctx.moveTo(125, 125);\nctx.lineTo(125+75, 125+75);\nctx.stroke();\n// save drawing to disk\ncanvas.toPNG().then((png) =\u003e require('fs').writeFile(__dirname + '/peacecolor.png', png, (err) =\u003e {\n    if (err)\n    {\n        console.log(err);\n    }\n    else\n    {\n        // read the image back to canvas and resize it\n        const img = new CanvasLite.Image();\n        img.onload = () =\u003e {\n            const canvas2 = new CanvasLite(200, 200);\n            canvas2.getContext('2d').drawImage(img, 0, 0, 300, 300, 0, 0, 200, 200);\n            canvas2.toPNG().then((png) =\u003e require('fs').writeFile(__dirname + '/peacecolor2.png', png, (err) =\u003e {\n                if (err) console.log(err);\n            }));\n        };\n        img.src = __dirname + '/peacecolor.png';\n    }\n}));\n```\n\n**result:**\n\n![colorful peace sign](./test/peacecolor.png)\n![colorful peace sign smaller](./test/peacecolor2.png)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffoo123%2Fcanvaslite","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffoo123%2Fcanvaslite","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffoo123%2Fcanvaslite/lists"}