图形引擎调研
图形引擎概览
| 引擎 |
定位/场景 |
渲染器 |
开源/协议 |
| pixiJS |
在线游戏、教育内容、互动广告、数据可视化 |
WebGL/Canvas |
✅ MIT |
| leaferJS |
高效绘图 、UI 交互(小游戏、互动应用、组态)、图形编辑 |
Canvas |
✅ MIT |
| p5.js |
教育/学术 |
Canvas |
✅ LGPL-2.1 |
| Zrender |
图表绘制 |
Canvas/Svg |
✅ BSD-3-Clause |
| Antv/G |
图表 地图 图 |
Canvas/Svg/WebGL/WebGPU |
✅ |
功能/特性对比
|
antv/g |
zrender |
| 几何图形绘制 |
都支持 path 绘制,所以两者并没有区别 |
|
| 动画能力 |
都支持状态过渡和帧动画 |
|
| 3d 渲染 |
支持 |
不支持 |
| 滤镜 |
支持,但无法进行属性过渡动画 |
不支持 |
| 裁剪 |
支持,但不支持复合路径裁剪 |
支持,且支持复合路径裁剪 |
| 事件系统 |
类似 DOM 的冒泡机制 |
事件总线机制 |
Demo
G
Zrender
总结
antv/g和zrender在使用体验上相差并不大。总体上来讲,在易用性上antv/g要略优于zrender,在渲染性能上zrender要略优于antv/g。在可扩展性和多渲染器支持上antv/g要优于zrender。antv/g 的 API 稳定性相较于zrender略差。大版本之间的不兼容 api 变动较 zrender 更多一些。且迭代相对更为频繁。另外G2Plot已停止维护。
参考 & 引用
https://stackblitz.com/@sz-p/collections/grapic-engein