Code
Both
Preview
  示例代码
光速引擎
🖼️ Viewport Lighter
ViewportLighter
Viewport Lighter
10万级矩形元素流畅缩放
1万张不同的小图片流畅缩放
3千张不同的图片流畅缩放
1万条路径流畅缩放
优化二次大量创建元素的性能
强制缓存视图
🗺️ Image Lighter
ImageLighter
Image Lighter
大图流畅操作
大长图流畅操作
超大图流畅操作
1千张不同的图片流畅操作
复杂 SVG 图片流畅编辑
LOD 图片加载
瓦片图 加载
SVG 放大时自动切片
自动回收资源
🪶 Vector Lighter
VectorLighter
VectorLighter
创建 complex 元素
🔳 Regions Lighter
RegionsLighter
Regions Lighter
多个区域独立渲染
高端插件
✂️ 裁剪图片
ClipEditor
Clipper
自由裁剪
快速修改裁剪控制点大小
快速修改裁剪控制点颜色
图片只能在有效范围内拖动、裁剪（暂不支持同时旋转、倾斜图片，限制效果会有误差，后续会支持）
手势控制图片
围绕裁剪框中心旋转
显示水平线
仅在操作时显示水平线
在多个 fill、stroke 中指定需要裁剪的图片填充对象
可移动的裁剪框
突出显示并置顶渲染裁剪元素，淡化其他元素
自定义复杂样式
裁剪 Image 元素
裁剪 Line 元素
裁剪 Path 元素
TransformTool
Clipper
缩放背景
resize 裁剪框
🧩 平铺图片
TileEditor
Tiler
自由平铺
快速修改平铺控制点大小
快速修改平铺控制点颜色
设置遮罩层颜色
图片只能在有效范围内拖动、平铺（暂不支持同时旋转、倾斜图片，限制效果会有误差，后续会支持）
手势控制图片
围绕元素编辑框中心旋转
显示水平线
仅在操作时显示水平线
在多个 fill、stroke 中指定需要平铺的图片填充对象
可移动的元素框
突出显示并置顶渲染平铺元素，淡化其他元素
自定义复杂样式
平铺 Image 元素
平铺 Line 元素
平铺 Path 元素
TransformTool
Tiler
缩放图片
resize 元素
✒️ 路径编辑器
PathEditor
Path Editor
创建路径
编辑路径
新增模式
配置样式
自定义光标
转换曲线手柄类型
断开节点
节点坐标
路径节点对象
编辑路径时，固定背景图片
节点吸附
模拟历史记录重写
编辑Rect元素
编辑圆角Rect元素
编辑圆角Line元素
编辑Ellipse元素
编辑Star元素
编辑Polygon元素
🌈 渐变编辑器
GradientEditor
渐变编辑
线性渐变
径向渐变
角度渐变
默认选中一个色标
在多个 fill、stroke 中指定需要编辑的渐变对象
配置色块样式
配置渐变编辑框的控制点和线
进阶插件
🎞️ 动图
Film
Film
等待动图加载完，再添加到引擎中
创建Film元素
使用 fill 代替 url
使用 Rect 代替 Film
监听动图加载成功事件
监听动图加载失败事件
🖼️ 图片滤镜
Image Filter
Image Filter
添加图片滤镜
自定义图片滤镜
🔗 连线
Linker
Linker
创建连线元素
带流动动画的连线元素
拖拽创建连线元素
连线元素固定线宽不随视图放大
创建连线点，自动吸附方向、偏移距离
💈 渐变过渡
Transition
Transition
带渐变动画的连线元素
带渐变动画的边框
hover时渐变颜色过渡
增强插件
↕️ Box滚动条
Scroller
Box滚动条
快速创建
夜晚模式
配置颜色和光标
无圆角的滚动条
保持显示
只允许拖拽滚动条进行滚动内容
跟随视图放大滚动条
与视图滚动条共存
与视图滚动条共存时，阻止默认视图滚动
☁️ 阴影变形
shadow
阴影变形
skew 倾斜变形
设置 origin 变形中心点
rotate 旋转阴影
📽️ 后台运行
BackgroundRunner
后台运行
切换浏览器tab标签页后，后台仍持续渲染动画
控制最大渲染帧
禁用后台渲染
App.ts
实时预览
清空
TS
JS