mxgraph

2020-06-09  本文已影响0人  栗子daisy
前端绘制图形有3种方式:
前端绘制图形
HTML + CSS 简单。CSS3炫酷 依赖浏览器环境; 无模块机制,复用难
canvas 使用广泛,例如echarts;强大的API;渲染快 依赖浏览器环境; 复杂;不方便保存和导出
svg 简单,矢量图 渲染慢

mxGraph默认绘制的是svg图形(看API文档和源码发现也支持canvas),所以支持后端语言进行预渲染,同时也支持保存和导出,转化为位图也非常方便。

mxGraph的使用场景:

图形可视化、图形交互、图形布局、图形分析

核心概念cell

cell这个概念可以理解成为双向数据绑定中的数据模型,我们需要修改图形的时候,应该通过mxGraph提供的API来修改mxCell实例的属性,然后mxGraph的绘图函数来根据数据模型来修改视图。
mxGraph的其他很多概念都是以cell作为基础的:样式、布局、内容文本、事件、位置......

mxGraph使用经验总结
在React和Vue中引入mxGraph示例
mxGraph 入门实例教程

上一篇 下一篇

猜你喜欢

热点阅读