最近要做图表展示，所以要找一些工具，网上找了很多，看了一圈选中了 AntV。
- 选择理由：★★★★★ 五颗星--阿里出品
- 最主要的是： 全中文，而且文档超全，样例还能在线编辑，真是强大至极啊；
使用说明：
一、使用过程中主要是用到2个页面
二、数据组装
-
根据例子中的数据形式，全部使用json，但是还有一种类型，我没研究，索性就直接用json了，毕竟很方便，不过直接通过ajax返回的json好像不支持呢（js学艺不精呢。。。），我就用了笨方法，通过php将数组生成到一个json文件中，所以直接在js中引用json数据，有点笨但是行得通啊。。不管了。。
image.png- !注：生成json文件这里有个小坑，就是权限问题，一定要在新建文件之后，把权限直接加上，不然到时候莫名其妙的不生效；
-
json结构：
[
{"type":"as","num":9},
.
.
.
{"type":"fe","num":6}
]
- 然后在js中就是组装图表了
1.表格代码直接从你选好的图表中copy下来,标记的地方差不多做一下相应修改；
2.修改图表x轴、y轴名称，以及数据源名称等等，这个比葫芦画瓢都能会用；
3.当然了这里面有些东西还是要变化一下的，不如x轴的分类应该跟json数据源中对应上，这就需要自己提前封装好，这边直接调方法引过来；还有就是每个分类的颜色要跟总数对应上，这里我是通过获取分类的数组总长度然后随机生成这么多个颜色，然后组装成数组直接用的；
function getRandomColor(data) {
randColor = [];
for (var i = 0; i < data.length; i++) {
color = "#" + ("00000" + ((Math.random() * 16777215 + 0.5) >> 0).toString(16)).slice(-6);
randColor.push(color)
}
return randColor;
}
4.差不多就做这些东西，图表就出来了，好用死了O(∩_∩)O~
#最后来个成果展示吧:
- 这个属于2类数据 [个数，业务线]，支持切换业务线；
- 这个属于3类数据 [比例，名称，业务线]，前两个是x轴，y轴，然后业务线用作切换展示用；
@2017-07-20 18:15:52 要下雨。。。
