iDraw.js——基于Canvas的前端绘图JavaScript框架
发布自: lowcoder
时间: 2021-9-16
2904人围观
iDraw.js简介
- 一个基于纯Canvas来实现绘图和操控素材能力的JavaScript库
- 可以基于 iDraw.js 进行扩展自定义开发各种可视化操控应用
iDraw.js有哪些功能
- 支持绘制文字、矩形、圆形、图片、HTML片段和SVG片段 绘图元素
- 绘制文字
iDraw.js有哪些特点
- 可以绘制文字、矩形、圆形、图片、HTML片段和SVG文件,并且作为绘图元素。
- 可以直接在Canvas操控以上绘图元素,不用担心CSS和DOM变化的污染问题。
- Canvas操控绘制,并且是所见即所得可以直接导出绘制的图片结果。
- 由于可视化操控和图片生成都是基于Canvas,可以尽量减少绘图的浏览器兼容问题。
原理介绍
- 基于数据驱动来绘制Canvas的图画
- 基于 requestAnimationFrame 来控制数据变化时候,Canvas的重绘处理
- 内置一个前端并发队列来处理 图片、HTML和SVG的图片化转换渲染
实际使用案例
- 一个基于 iDraw.js 实现的UI可视化绘图
- @idraw/studio 的实现
6 点个赞支持一下?