ECharts:一个页面显示多个环形图

ECharts:一个页面显示多个环形图_第1张图片

一、后台返回一个集合Map>> ,每个map对应一个图。

二、jsp 页面

1、首先引入 jquery 和echarts 的 js文件

2、创建 展示环形图的div

    

3、echarts加载,用ajax访问后台获取数据


ECharts:一个页面显示多个环形图_第2张图片
初始化div,访问后台获取数据


ECharts:一个页面显示多个环形图_第3张图片
设置option


ECharts:一个页面显示多个环形图_第4张图片
设置标题


ECharts:一个页面显示多个环形图_第5张图片
取数据,设置arr,把arr添加到option.series中
ECharts:一个页面显示多个环形图_第6张图片
ECharts:一个页面显示多个环形图_第7张图片

总结:

一个页面要显示多个图表(不同的)时,添加多个div,然后给每个div加载echarts图表,配置option;

一个页面要显示多个图表(相同的)时,如上,把series设置为数组,然后一个一个的添加即可。

你可能感兴趣的:(ECharts:一个页面显示多个环形图)