echarts 饼图进度条_echarts饼图

在echarts的官网上我们可以看到很多的官方实例，很多酷炫的模型都已经设计好了，不过这些模型的数据一般都是在实例中写死，平时在我们项目里可没有这些死数据，如何从后台获取需要的数据，并且把这些数据拼装成echarts需求的json数据，这个对于像我一样的小白可能有点麻烦，这里我把我解决的过程简要的做个总结。

首先获取数据我们可以通过ajax的方式从后台获取数据源并将返回的数据设置成json格式，至于后台的数据得先根据你的echarts图需要的格式设计。比如饼状图需求的数据格式为({  name :张三,value : 666 }，{  name :李四,value : 333})

下面我会上具体的代码来说明：

1、首先是在controller上写出获取数据的方法

//这个方法一般用于前台ajax请求获取数据//一般写在controller中，你这个按照springMVC的注解给这个方法添加访问路径

public MapgetData() {int a = 0;//a代表已采集

int b = 0;//b代表等待采集

int c = 0;//c代表延迟未提供

int d = 0;//d代表数据稽核预警

int e = 0;//e代表采集异常//这里可以通过后台的方法获取数据源，然后对数据进行加工，获取echarts图形需要//的数据，即我上面设置的abcde

List collectList =resourceService.getResourceByList();//之后可以通过foreach循环处理数据或者

for(Resource li : collectList) {//具体处理这里就不写了

｝

List name = new ArrayList<>();

List value = new ArrayList<>();//给name传值

name.add("已采集");

name.add("等待采集");

name.add("延迟未提供");

name.add("数据稽核预警");

name.add("采集异常");//给value传值，这里的abcde

value.add(a);

value.add(b);

value.add(c);

value.add(d);

value.add(e);

Map data = new HashMap();

data.put("names", name);

data.put("values", value);returndata;

}

View Code

2、在jsp页面上引入你需要相关控件,并给你的echarts图画个容器

">