Echarts圖表實現後臺數據統計

柱狀圖獲取後臺數據展示：

餅圖獲取後臺數據展示：

前端實現方法：

<code>	var myChart = echarts.init(document.getElementById('div1'));
			var myChart1 = echarts.init(document.getElementById('div2'));
			var names = [];
			var values = [];
			$.ajax({
			    type : "POST",
			    async:true,
				url : /*[[@{/admin/getCharts}]]*/,
				dataType : "json",
				success : function(result) {
				 if (result != null && result.length > 0) {
				  for(var i=0;i{b} : {c} ({d}%)'
							},
							   legend: {
							        bottom: 10,
							        left: 'center',
							        data: names
							    },
							series : [
								{
								    name: '數據餅圖',
									type : 'pie',
									radius: '65%',
						            center: ['50%', '50%'],
						            selectedMode: 'single',
									data : result
								}
							]
						});
						}else{
						alert("圖表請求數據為空，可能服務器暫未錄入，您可以稍後再試！");
						}
				},
				error:function(errorMsg){
				 alert("圖表請求數據失敗，可能是服務器開小差了");
				}
			
			});/<code>

後端實現方法：

<code>@RequestMapping(value="/getCharts",method=RequestMethod.POST)
	@ResponseBody
	public List getCharts(){
		List list=new ArrayList();
		//發佈量
		int blogCount=blogService.getAllCount();
		//閱讀量
		int sumViews=blogService.sumViews();
		//點贊量
		int thumbsupCount=thumbsUpService.getAllCount();
		//評論量
		int commentCount=commentService.getAllCount();
		//收藏量
		int collectionCount=collectionService.getAllCount();
		list.add(new EchartsData("發佈量",blogCount));
		list.add(new EchartsData("閱讀量",sumViews));
		list.add(new EchartsData("點贊量",thumbsupCount));
		list.add(new EchartsData("評論量",commentCount));
		list.add(new EchartsData("收藏量",collectionCount));
		return list;
	}/<code>

儀表盤界面：