https://github.com/jamen/canvas-wasm
Canvas functions suitable for WebAssembly
https://github.com/jamen/canvas-wasm
Last synced: 9 months ago
JSON representation
Canvas functions suitable for WebAssembly
- Host: GitHub
- URL: https://github.com/jamen/canvas-wasm
- Owner: jamen
- Created: 2017-09-13T22:48:15.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-11-10T14:15:24.000Z (over 8 years ago)
- Last Synced: 2025-01-10T20:03:40.368Z (over 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 5.86 KB
- Stars: 16
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# canvas-wasm
> Canvas functions suitable for WebAssembly
Canvas's [`CanvasRenderingContext2D`](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D) has several methods, setters, and getters **not** suitable for WebAssembly. Use this module to wrap a context for making it suitable.
**Notice:** This is experimental and doesn't include a lot of things. Currently nothing using [memory](https://github.com/WebAssembly/design/blob/master/Semantics.md#linear-memory) is made.
- [ ] Pixel/image manipulation
- [ ] Gradients and patterns
- [ ] Text objects and styling
- [ ] Hit regions
- [ ] Other non-standard APIs
## Install
```sh
npm i canvas-wasm
```
**Note:** See [`browserify`](https://github.com/browserify/browserify) and [`wasmify`](https://github.com/jamen/wasmify) for an easy way to building WASM projects.
## Usage
### `create_*`
Creating shapes without using paths
- `create_rect(x, y, width, height)`
### `path_*`
- `path_begin()`
- `path_close()`
- `path_move(x, y)`
- `path_line(x, y)`
- `path_fill()`
- `path_stroke()`
- `path_bezier_curve(c1x, c1y, c2x, c2y, x, y)`
- `path_quadradic_curve(cx, cy, x, y)`
- `path_circle(x, y, radius)`
- `path_arc(x, y, radius, startAngle, endAngle)`
- `path_ellipse(x, y, rx, ry, rot, startAngle, endAngle)`
- `path_rect(x, y, width, height)`
### `clear_*`
- `clear()`
- `clear_rect(x, y, width, height)`
### `set_*`
- `set_stroke_color(r, g, b)`
- `set_fill_color(r, g, b)`
- `set_line_width(w)`
- `set_line_cap(0 | 1 | 2)`
- `butt`, `join`, `square` respectively
- `set_line_join(0 | 1 | 2)`
- `round`, `bevel`, `miter` respectively
- `set_shadow_blur(x)`
- `set_shadow_color(r, g, b, a)`
- `set_shadow_offset_x(x)`
- `set_shadow_offset_y(y)`
### `transform_*`
- `transform_rotate(deg)`
- `transform_scale(x, y)`
- `transform_translate(x, y)`
- `transform(a, b, c, d, e, f)`
- `set_transform(a, b, c, d, e, f)`
- `reset_transform()`
### State functions
- `save()`
- `restore()`