echarts图表经常需要ajax请求刷新,以下为使用实例:

在向图表option传递数据时,要使用函数传参的形式。
var units=[];
var cap=[];
function reChanNeng(){
      $.ajax({
        type : "post" ,
        async : true ,            //异步请求(同步请求将会锁住浏览器,用户其他操作必须等待请求完成才可以执行)
        url : "UnitCNservlet" ,    //请求发送到UnitCNservlet处
        data : {},
        dataType : "json" ,        //返回数据形式为 json
        success : function (result) {
             for ( var i=0; i<result.length; i++) 
                        { 
                         switch (result[i].UNIT){
                         case '0101' :units[i]= '单元一' ; break ;
                         case '0102' :units[i]= '单元二' ; break ;
                         case '0103' :units[i]= '单元三' ; break ;
                         case '0104' :units[i]= '单元四' ; break ;
                         case '0105' :units[i]= '单元五' ; break ;
                         case '0106' :units[i]= '单元六' ; break ;
                        }
                              cap[i]=(result[i].CAP_SCORE);
                         }
            setOption(units,cap); //将取得数据传递给 echarts
        },
        error : function (errorMsg) {
            //请求失败时执行该函数
        alert( "图表请求数据失败!" );
        }
   });
}     
var channeng=document.getElementById( 'ChanNeng' );
var myChanNeng=echarts.init(document.getElementById( 'ChanNeng' ));
//需要使用传参的形式
function setOption(date1,date2){  
             var option={
                          color: [ '#3398DB' ],
                            title : {
                                text: '线体产能' ,
                                subtext: '数据来自MDS'
                            },
                            tooltip : {
                                trigger: 'axis' ,
                                formatter: "{a} <br/>{b} : {c} %"
                            },
                            legend: {
                                data:[ '线体产能' ]
                            },
                            toolbox: {
                                show : true ,
                                feature : {
                                    dataView : {show: true , readOnly: false },
                                    magicType : {show: true , type: [ 'line' , 'bar' ]},
                                    restore : {show: true },
                                    saveAsImage : {show: true }
                                }
                            },
                            calculable : true ,
                            xAxis : [
                                {
                                    type : 'category' ,
                                   
                                          data:date1
                                }
                            ],
                            yAxis : [
                                {
                                    type : 'value' ,
                                }
                            ],
                            series : [
                                {
                                    name: '线体产能' ,
                                    type: 'bar' ,
                                          data:date2,
                                          barWidth: '50%'
                                },
                            ]
                                    
                              };
            myChanNeng.setOption(option);
      };