Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/djdeveloperr/skia_canvas
Fast HTML Canvas API implementation for Deno using Google Skia
https://github.com/djdeveloperr/skia_canvas
canvas cpp deno fastest ffi hacktoberfest skia typescript
Last synced: about 2 hours ago
JSON representation
Fast HTML Canvas API implementation for Deno using Google Skia
- Host: GitHub
- URL: https://github.com/djdeveloperr/skia_canvas
- Owner: DjDeveloperr
- License: apache-2.0
- Created: 2022-09-19T07:19:45.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-10-11T01:14:52.000Z (4 months ago)
- Last Synced: 2025-01-26T01:09:25.996Z (7 days ago)
- Topics: canvas, cpp, deno, fastest, ffi, hacktoberfest, skia, typescript
- Language: C++
- Homepage: https://jsr.io/@gfx/canvas
- Size: 984 KB
- Stars: 138
- Watchers: 1
- Forks: 9
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# Skia Canvas
[](https://github.com/DjDeveloperr/skia_canvas/releases)
[](https://doc.deno.land/https/deno.land/x/[email protected]/mod.ts)
[](https://github.com/DjDeveloperr/skia_canvas/actions/workflows/ci.yml)
[](https://github.com/DjDeveloperr/skia_canvas/blob/master/LICENSE)
[](https://github.com/sponsors/DjDeveloperr)
Fast HTML Canvas API implementation for Deno using Skia.
## Example
```ts
import { createCanvas } from "jsr:@gfx/[email protected]";
const canvas = createCanvas(300, 300);
const ctx = canvas.getContext("2d");
// Set line width
ctx.lineWidth = 10;
// Wall
ctx.strokeRect(75, 140, 150, 110);
// Door
ctx.fillRect(130, 190, 40, 60);
// Roof
ctx.beginPath();
ctx.moveTo(50, 140);
ctx.lineTo(150, 60);
ctx.lineTo(250, 140);
ctx.closePath();
ctx.stroke();
canvas.save("image.png");
```
## Usage
Since this library depends on the unstable FFI API, you must pass `--allow-env`,
`--allow-ffi` and `--unstable-ffi` flags. Without it, the module will fail to
find and open native library.
```sh
deno run --allow-ffi --allow-env --unstable-ffi
# or just
deno run -A --unstable-ffi
```
## API
Check the
[API reference here](https://doc.deno.land/https/deno.land/x/[email protected]/mod.ts).
Since this module implements the Canvas Web API, you can also refer to the
[MDN docs](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D).
### Non-standard APIs
For non-standard APIs, see to the API reference mentioned above.
- `Canvas#save` - save canvas render as file
- `Canvas#encode` - encode render into in-memory buffer
- `Image` - provides utility to load image files for drawing on canvas
- `Fonts` - provides utility to manage fonts used by Skia
- `PdfDocument` - create PDF documents using 2D Canvas API
- `SvgCanvas` - like `Canvas` but creates an SVG as output instead
- Several additional methods in `Path2D` object such as `toSVGString`,
`simplify`, `difference`, `xor`, etc.
## Benchmarks
Source: [bench/main.js](./bench/main.js)
## Building
First you need to
[setup depot_tools](https://www.chromium.org/developers/how-tos/install-depot-tools/).
Then, clone the repository with submodules.
And run the following commands:
```sh
deno task build-skia
deno task build
```
By default, the module will download and cache the prebuilt binaries for your
platform. However this is not intended behavior when developing locally. To use
locally built binaries, set `DENO_SKIA_LOCAL` environment variable to `1`. Or
you can also set `DENO_SKIA_PATH` to a complete path to dynamic library built
from the `native` directory.
## License
[Apache-2.0](./LICENSE) licensed.
Copyright 2022-present © DjDeveloperr