@idraw/renderer
Advanced tools
Comparing version 0.2.0-alpha.22 to 0.2.0-alpha.23
{ | ||
"name": "@idraw/renderer", | ||
"version": "0.2.0-alpha.22", | ||
"version": "0.2.0-alpha.23", | ||
"description": "", | ||
@@ -27,6 +27,6 @@ "main": "dist/index.cjs.js", | ||
"devDependencies": { | ||
"@idraw/types": "^0.2.0-alpha.22" | ||
"@idraw/types": "^0.2.0-alpha.23" | ||
}, | ||
"dependencies": { | ||
"@idraw/util": "^0.2.0-alpha.22" | ||
"@idraw/util": "^0.2.0-alpha.23" | ||
}, | ||
@@ -36,3 +36,3 @@ "publishConfig": { | ||
}, | ||
"gitHead": "884153bfe050aee75f4d132316db3bb750371375" | ||
"gitHead": "aa224a92b784315735075c8fefcf1222d228ebc8" | ||
} |
# @idraw/renderer | ||
[](https://github.com/idrawjs/idraw/actions/workflows/node.js.yml) | ||
[](https://github.com/idrawjs/idraw/actions/workflows/node.js.yml) | ||
## Usage | ||
### Quick Start | ||
```sh | ||
npm i @idraw/renderer | ||
``` | ||
```js | ||
import Renderer from '@idraw/renderer'; | ||
const renderer = new Renderer({ | ||
width: 600, | ||
height: 400, | ||
contextWidth: 600, | ||
contextHeight: 400, | ||
devicePixelRatio: 1, | ||
}); | ||
const canvas = document.querySelector('canvas'); | ||
renderer.render(canvas, { | ||
elements: [ | ||
{ | ||
name: "rect-001", | ||
x: 10, | ||
y: 10, | ||
w: 200, | ||
h: 100, | ||
type: "rect", | ||
desc: { | ||
bgColor: "#f0f0f0", | ||
borderRadius: 20, | ||
borderWidth: 10, | ||
borderColor: "#bd0b64", | ||
}, | ||
}, | ||
] | ||
}) | ||
``` | ||
### Events | ||
```js | ||
renderer.on('load', (e) => { | ||
// ... | ||
}) | ||
renderer.on('loadComplete', (e) => { | ||
// ... | ||
}) | ||
renderer.on('drawFrame', (e) => { | ||
// ... | ||
}) | ||
renderer.on('drawFrameComplete', (e) => { | ||
// ... | ||
}) | ||
``` | ||
## Documents | ||
- [Documents](https://idraw.js.org/docs/en/) | [中文文档](https://idraw.js.org/docs/zh/) | ||
- [Online Playground](https://idraw.js.org/playground/) | [在线API示例](https://idraw.js.org/playground/) |
Deprecated
MaintenanceThe maintainer of the package marked it as deprecated. This could indicate that a single version should not be used, or that the package is no longer maintained and any new vulnerabilities will not be fixed.
Found 1 instance in 1 package
218463
0
68
Updated@idraw/util@^0.2.0-alpha.23