echarts动态添加数据

创建echarts模型

// 创建一个存放模型的div，并初始化模型
<div id="Map-cal-bar" style="width:100%;height:400px;float: left;"></div>
//条线图
 <script type="text/javascript">
 var barInstantiation = echarts.init(document.getElementById('Map-cal-bar'));       
var barChart  = {
            xAxis: {
                type: 'category',
                axisLabel: {
                    interval: '0',
                    rotate: -40
                },
                data: mapData1
            },
            yAxis: {
                type: 'value'
            },
            series: [{
                data: mapData2,
                type: 'line',
                smooth: true
            }]
        };
        // 使用刚指定的配置项和数据显示图表。
        barInstantiation.setOption(barChart);
 </script >

动态获取数据

// 加载数据之前需要将图标Loading
barInstantiation.showLoading({
                text: '数据正在加载...',
                textStyle: { fontSize: 30, color: '#444' },
                effectOption: { backgroundColor: 'rgba(0, 0, 0, 0)' }
            });
 //使用jQuery的get方法获取数据
            $.get(ServerPath + 'api/tic_ticket/prsonCnt?dtbegin=' + dtbegin + '&dtend=' + dtend + '&isprd=' + isprd + '&datetype=' + datetype ).done(function (obj) {
                //获取数据
                var Datelist = obj.rows.Datelist;
                var Cont = obj.rows.Cont;  
                barInstantiation.setOption({
	                    xAxis: {
	                    //赋值
	                        data: Datelist
	                    },
	                    series: [{
	                    //赋值
	                        data: Cont
	                    }]
                });
                //赋值后将图标取消Loading
                barInstantiation.hideLoading();
            });  

后台数据格式

这种的比较简单，准备两个数组即可.