leafer-ui
Web 版 ｜ Worker 版 ｜ Node 版 ｜ 小程序版
如果您仅需绘图功能，推荐更轻量的 leafer-draw。
安装
在 WebWorker 环境中运行。
sh
npm install @leafer-ui/workersh
pnpm add @leafer-ui/workersh
yarn add @leafer-ui/workersh
bun add @leafer-ui/workerimportScripts 引入
通过全局变量 LeaferUI 访问内部功能。
js
importScripts(
'https://unpkg.com/@leafer-ui/worker@1.0.0-rc.27/dist/worker.min.js'
)js
importScripts('https://unpkg.com/@leafer-ui/worker@1.0.0-rc.27/dist/worker.js')体验
通过 Worker 创建一张包含矩形的画布，并在主线程生成图片显示。
js
const worker = new Worker('./worker.js') // 相对当前运行的根目录
worker.onmessage = (e) => { // 通过worker生成一张图片进行显示
const image = new Image()
image.src = e.data
document.body.appendChild(image)
}js
// 你也可以使用npm包模式，编译成js文件供worker调用
importScripts(1.0.0-rc.27
'https://unpkg.com/@leafer-ui/worker@1.0.0-rc.27/dist/worker.min.js'
)
const { Leafer, Rect } = LeaferUI
const leafer = new Leafer({ width: 800, height: 600 })
leafer.add(Rect.one({ fill: '#32cd79' }, 100, 100))
leafer.export('jpg').then((result) => {
self.postMessage(result.data)
})