Echarts异步获取数据,刷新实例

2019独角兽企业重金招聘Python工程师标准>>>

function orgEcharts(){
	var echartsData = [["年份"],["新训"],["复训"]];
	var dom = document.getElementById("container");
	var myChart = echarts.init(dom);
	var app = {};
	$.ajax({
		url:'list/data.do',
		data:{
			trainingunitId :$('#tree').val()
		},
		type:'post',
		dataType:'json',
		success:function(data){
			for(var i=0;i<data.length;i++){
				echartsData[0].push(data[i].year);
				echartsData[1].push(data[i].registerCount);
				echartsData[2].push(data[i].driverRegisterCount);
			}
			option = null;
			option = {
				legend : {},
				tooltip : {},
				dataset : {
					source : echartsData
				},
				
				xAxis : [ {
					type : 'category',
					gridIndex : 0
				}, {
					type : 'category',
					gridIndex : 1
				} ],
				yAxis : [ {
					gridIndex : 0
				}, {
					gridIndex : 1
				} ],
				grid : [ {
					bottom : '55%'
				}, {
					top : '55%'
				} ],
				series : [
				// These series are in the first grid.
				{
					type : 'bar',
					seriesLayoutBy : 'row'
				}, {
					type : 'bar',
					seriesLayoutBy : 'row'
				}, 
				// These series are in the second grid.
				{
					type : 'bar',
					xAxisIndex : 1,
					yAxisIndex : 1
				}, {
					type : 'bar',
					xAxisIndex : 1,
					yAxisIndex : 1
				}, {
					type : 'bar',
					xAxisIndex : 1,
					yAxisIndex : 1
				} ],
				label : {
					show : true,
					position : 'top'
				}
			};
			;
			if (option && typeof option === "object") {
				myChart.setOption(option, true);
			}
		}
		
	});
}

先设置了一个数组 echartsData,ajax请求吧数据导入到数据,然后赋值给dataset.source,实现数据赋予 运行orgEcharts()方法,重新请求数据,如果数据改变,就刷新图像

转载于:https://my.oschina.net/u/3500033/blog/1843772