動態獲取資料，在圖表中顯示
效果圖：

後端;
通過json 傳遞list陣列給前端

	public String tellNum(){
			ArrayList<MonthCount> list = CountManage.getTellOrder();
	                JSONArray jsonarray = JSONArray.fromObject(list);
			return ajaxJsonArray(jsonarray);
	}
	//getTellOrder()  獲取資料參考前文

前端：

<!-- 引入echarts外掛-->
<script src="js/echarts.js"></script>

<script type="text/javascript">
    var myChart = echarts.init(document.getElementById('main')); 
         var week=[];	//星期
         var nums=[];    //總數 陣列（實際用來盛放Y座標值）
         var loseorder=[];//未接
         var getorder=[];//完成
         
         $.ajax({
         	type : "post",
         	async : false,            //非同步請求（同步請求將會鎖住瀏覽器，使用者其他操作必須等待請求完成才可以執行）
         	url : "<%=basePath%>tellNumlist.action?method=tellNum",
         	dataType : "json",        //返回資料形式為json
         	success : function(result) {
             //請求成功時執行該函式內容，result即為伺服器返回的json物件
            $.each(result,function(i,item){
            		 week.push(result[i].week)          		            		            		 
            		 nums.push(result[i].count);           		            		            		 
            		 loseorder.push(result[i].loseorder);           		            		            		 
            		 getorder.push(result[i].getorder);           		            		            		 
            		 });
                    myChart.hideLoading();    //隱藏載入動畫
                    myChart.setOption({        //載入資料圖表
					    title : {
					        text: '訂單數圖表'
					    },
					    tooltip : {
					        trigger: 'axis'
					    },
					    legend: {
					        data:['已取消','已完成','訂單總數']
					    },
					
					    calculable : true,
					    xAxis : [
					        {
					            type : 'category',
					            data : week
					        }
					    ],
					    yAxis : [
					        {
					            type : 'value'
					        }
					    ],
					    series : [
					        {
					            name:'已取消',
					            type:'bar',
					             label: {
					                normal: {
					                    show: true,
					                    position: 'inside'
					                }
					            },
					            data:loseorder,
					        },
					        {
					            name:'已完成',
					            type:'bar',
					            label: {
					                normal: {
					                    show: true,
					                    position: 'inside'
					                }
					            },
					            data:getorder,
					        },
					        {
					            name:'訂單總數',
					            type:'bar',
					            label: {
					                normal: {
					                    show: true,
					                    position: 'inside'
					                }
					            },
					            data:nums,
					            
					        }
					    ]
                    	
                    });
             }
        });
    </script>