# 项目入口

# 1.简单案例

import zrender from "zrender"
var zr = zrender.init(xxx)
var circle = new zrender.Circle(xxx)
zr.add(circle)
1
2
3
4

可以看到使用 zrender 步骤:

  • 引入资源
  • 初始化 zrender
  • 实例化相关图形
  • 将图形添加到 zrender 中

# 2.zrender

引入 zrender 时在源码内部会生成 zrender 类,原型上添加相关方法和属性

# 3.init

zrender 是基于 MVC 模式的整体架构,M 用 Storage 类表示,V 用 Painter 类表示,C 用 Handler 类表示,初始化时会实例化各类,通过 Handler 类将三者组合在一起

# 4.shape

内部定义一些形状的模板,通过修改简单的参数可以具体为一个图形(类似用虚拟 node 描述真实 node)

# 5.add

内部会触发刷新绘图,从而使页面显示图形