图形编辑器
用于编辑操作图形，提供了丰富的功能和 样式配置， 可移动、缩放、旋转、倾斜，支持多选、框选、打组、 双击进组，锁定、层级。支持自定义 编辑工具、 内部编辑器。
适用平台
web 版、小程序版。暂时与有 around 属性的元素不能混用。
后面计划会增加精细化的属性编辑器，如编辑圆角、形状、路径等
安装插件
需要安装编辑器插件才能使用，点此访问 Github 仓库。
sh
npm install @leafer-in/editorsh
pnpm add @leafer-in/editorsh
bun add @leafer-in/editor浏览器
通过全局变量 LeaferIN.editor 访问插件内部功能。
html
<script src="https://unpkg.com/@leafer-in/editor@1.0.0-rc.27/dist/editor.min.js"></script>
<script>
const { Editor } = LeaferIN.editor
</script>html
<script src="https://unpkg.com/@leafer-in/editor@1.0.0-rc.27/dist/editor.js"></script>
<script>
const { Editor } = LeaferIN.editor
</script>https://unpkg.com 无法访问时，可替换为 https://cdn.jsdelivr.net/npm
依赖插件
resize 插件
开始体验
点击选中元素， 支持多选、框选。
将光标移动至控制点或边上，拖动可缩放元素。
将光标移动至控制点外沿，出现方向光标，拖动可旋转元素。
按住Ctrl / Command 键，将光标移动至四条边上，拖动可倾斜元素。
注意事项
编辑器必须在 App 中使用, 通过传入 editor 配置，可实现自动创建 app.editor 实例及 app.tree, app.sky 分层结构，并自动将 editor 添加到 sky 层中。
ts
import { App, Rect } from 'leafer-ui'
import '@leafer-in/editor'
const app = new App({
view: window,
editor: {}
})
app.tree.add(Rect.one({ editable: true, fill: '#FEB027', cornerRadius: [20, 0, 0, 20] }, 100, 100))
app.tree.add(Rect.one({ editable: true, fill: '#FFE04B', cornerRadius: [0, 20, 20, 0] }, 300, 100))ts
import { App, Rect } from 'leafer-ui'
import { Editor } from '@leafer-in/editor'
const app = new App({ view: window })