# canvas-display

[![MIT licensed](https://img.shields.io/badge/license-MIT-blue.svg)](./LICENSE)
[![crates.io](https://img.shields.io/badge/crates.io-v0.1.2-orange.svg)](https://crates.io/crates/canvas-display/0.1.2)
[![docs.rs](https://docs.rs/canvas-display/badge.svg)](https://docs.rs/crate/canvas-display/)

Wasm32 implementation for embedded-graphics https://github.com/jamwaffles/embedded-graphics DrawTarget. It is based on a HTML canvas.

<img alt="canvas-display" width="420" src="https://codeberg.org/flovanco/assets/raw/commit/1839470fcbcc312465a29af51789d2832bf3714e/canvas-display.png">

## Usage

To include canvas-display in your project, add this dependency
line to your `Cargo.toml` file:

```text
canvas-display = "0.1.2"
```

To enable offscreen rendering, the crate provides a `offscreen` feature (no default feature). With this feature you have to call the `flip` method
on `CanvasDisplay` after rendering.

## Run examples

### Requirements

#### Rust

canvas-display requires Rust 1.30 or newer.

#### wasm-pack

`wasm-pack` is required for building Rust-generated WebAssembly. Install it from https://rustwasm.github.io/wasm-pack/installer/.

#### npm

`npm` is a JavaScript package manger and is used to install and run a JavaScript bundler and development server. You could install `npm` from https://www.npmjs.com/get-npm.

For the examples we uses the latest version of `npm`. You could install it with this command:

```shell
npm install npm@latest -g
```

### Run example

Navigate to directory of the example and run:

```shell
npm install
```

To serve the example locally run:

```shell
npm run serve
```

Navigate your Web browser to http://localhost:8080/

## Build and run documentation

You can build and view the latest documentation by executing the following command:

```text
cargo doc --no-deps --open
```