共计 669 个字符，预计需要花费 2 分钟才能阅读完成。
我的项目需要求在挪动端 H5 须要展现一些数据统计的图表，尽管第一工夫想到的是 echarts，常
用还有 Highcharts，D3 等，antv 家族的图表 UI 难看一些，再加上 F2 是挪动端可视化计划于是
就抉择 F2，关上官网果然眼前一亮 F2 提供的正能满足需要，F2 官网地址：
https://antv.alipay.com/zh-cn… 首次应用记录一下掘坑之路：
一，疾速上手（此处参考官网 api 文档就能够实现
https://www.yuque.com/antv/f2/getting-started）1. 习惯在 vue 外面应用 cnpm 装置，执行 cnpm install @antv/f2 –save
2. 装置实现之后就是应用了，依据 api 提供的援用形式在 vue 外面是玩不转的，波及到图表
交互的须要点击的图表会报 js 谬误（‘interaction’ is not a function），当然也不是
没有解决的方法的，看过源码会发现能够批改援用门路解决：const F2 =
require(‘@antv/f2/lib/index’) 复制代码二，开始应用应用也特地的简略，官网 api 给到
的十分的具体，首先须要创立 <canvas> 标签，咱们就能够进行简略的图表绘制: 创立
Chart 图表对象，指定图表 ID、指定图表的宽高、边距等信息；载入图表数据源；应用图
形语法进行图表的绘制；渲染图表。在官网 demo 中抉择相应本人想要的图表能够查看到代
码，利用到 vue 我的项目中就能够了，依据需要作相应的更改。
至此就能够看到成果了，是不是很简略大厂的货色就是香，真正做到了开箱即用
正文完
