小程序之 f2-canvas 组件绘图

       微信小程序的官方文档上有绘图组件canvas，可以通过官方文档了解绘图组件的使用方法。官方文档

此文章主要是基于f2-canvas 组件进行绘图。该组件的官方文档地址：AntV-F2。扫描提供的二维码，可以看到好多图标的示例，如图一所示：

图1.图表示例

F2 的微信小程序版本，该项目参考了echarts-for-weixin 的封装思路，即封装一个了自定义组件 <ff-canvas>，以方便用户使用。它的结构目录如下：

图2.组件结构目录

将文件放入自己的工程目录中，创建demo文件:index.json，index.wxss，index.wxml，index.js。

在index.json文件中，引入组件

图3.组件引入

在index.wxml文件中，加入

图4.wxml内容

在index.js文件中，加入

图5.控制命令部分

运行结果如下图：

图6.柱状图