Echarts图表是百度的良心产品,最近项目中需要用到雷达图以及仪表盘图,毫不犹豫的选择了Echarts进行图表的制作。Echart图表制作我也是根据echarts官网的一些案例以及配置手册制作的。
一、首先是在HTML前台页面中创建存放图表的div
二、初始化图表,就是告诉生成的图表你需要放在哪里?
var yibiao=echarts.init(document.getElementById(String(i+1)));
这里面存在一个问题,如果是div是在JS中创建的,那么就存在echarts图表初始化失败,因为我之前做的仪表盘图的个数是变化的,五个、六个、三个,之前想的也是动态生成div,有几个图就生成几个div,但是一直存在初始化失败的问题,后来无奈只好在HTML页面中按照最多的个数创建的,不太友好吧,无奈。
三、创建echarts图表
yibiao.setOption({})
四、给图表添加数据
这里面也有坑啊,相对于一般的
value[]中括号存放的是数组的形式,赋值的时候,你就直接给她一个数组就行。其中var years=[];
但是,对于下面这种,可是不行的
这个是雷达图中的一个参数对于这种[{}],这种东西好恶心,因为我们的这种图的指标不确定,所以text不确定有几个,你若是把它当做数组循环出来,是解析不了的,echarts图都不给你出了,于是还是找出最大值来,给他赋值
就是这些东西,妹的搞得我头晕脑胀的。