很多人刚学前端的时候,都想画出非常漂亮的图形,在日常的工作与生活中,图表也是非常需要的,很多前端工程师都需要画图表,以此来满足产品经理可视化分析的需求。今天,我们来介绍一款2D的Canvas画图引擎,ZRender,它是由百度开源的Echart里面的一个画图组件,在Github上面已经接近4000个星星。
ZRender有什么特点的?一个轻量级的Canvas类库,MVC封装,数据驱动,提供类Dom事件模型。给我们不一样的Canvas体验。我们甚至不需要去学习Canvas的API,只需要关注要画的图像本身。
ZRender是由数据驱动的,这意味着,我们想画图的时候,我们更多要关心的,只是图像的数据,至于怎么画,ZRender框架已经帮我们解决。例如,我们想画一个圆,我们只要关心圆心跟半径的位置即可,我们想要画一个矩形,只要关心矩形的左上角以及矩形的长宽即可。图像的颜色,透明度这些,都只是这些图像类的参数。更强大的是,如果我们需要这些图像可拖拽,也只要设置一个参数就行。