echarts动态获取数据并在下拉框选择事件中异步更新数据

最近做了一个项目需要用到echarts制作表图，然后就自学了一些，下面是使用echarts动态获取数据，这里我是用ajax向后台去数据库获取的数据
效果如下：

当点击查询时：

下面就是用代码来呈现怎样在事件刷选中异步刷新数据
这是前端的数据：

• 职务： --所有-- 部门1 部门2 部门3 部门4

• 					<li style="width: 90px;">
  				//	下拉框选择事件：
  						<button type="button" class="btn_search"
  							onclick="search_flight1()">
  							<i class="icon-search"></i>查询
  						</button>
  					</li>
  	<li style="width:130px;">
        <button type="button"  onclick="warning()" class="btn-warning btn"> &nbsp;打印图表数据</button>
      </li>
  				</ul>
  			</div>
  		</form>
  	</div>
  	<div style="margin-top: 10px;">
  		<p
  			style="display: inline-block; width: 50%; font-size: 16px; font-weight: bolder; line-height: 30px; margin-bottom: 20px; float: left;">
  			用户总数：<span style="color: #06C; font-style: italic;">allAdmin().rows</span>
  			<p>
  				<p
  					style="display: inline-block; width: 50%; font-size: 16px; font-weight: bolder; line-height: 30px; margin-bottom: 20px;">
  					&nbsp;<span style="color: #06C; font-style: italic;"></span>
  				</p>
  				<!-- 为ECharts准备一个具备大小（宽高）的Dom 用户性别统计 -->
  				<div id="main1"
  					style="height: 300px; overflow: hidden; width: 50%; overflow: auto; float: left;"></div>
  				<!-- 为ECharts准备一个具备大小（宽高）的Dom 用户年龄男女比例 -->
  				<div id="main2"
  					style="height: 300px; overflow: hidden; width: 50%; overflow: auto; float: left;"></div>
  	</div>
  </div> 
  

表格展示：

<script type="text/javascript">
var myChart1;
var test=10
//路径配置
	require.config({
		paths : {
			echarts : './assets/dist'
		}
	});
	require([ 'echarts', 'echarts/chart/pie', // 按需加载所需图表，如需动态类型切换功能，别忘了同时加载相应图表
	'echarts/chart/funnel' ], function(ec) {
		//获取容器的id并赋值给变量myChart
		myChart1 = ec.init(document.getElementById('main1'));

		option1 = {
			title : {
				text : '用户性别统计',
				subtext : '',
				x : 'center'
			},
			tooltip : {
				trigger : 'item',
				formatter : "{a} <br/>{b} : {c} ({d}%)"
			},
			legend : {
				orient : 'vertical',
				x : 'left',
				data : [ '女', '男' ]
			},
			toolbox : {
				show : false,
			},
			calculable : true,
			series : [ {
				type : 'pie', 
				data : [ {
					value : allAdmin().rownv,
					name : '女'
				}, {
					value : allAdmin().rownan,
					name : '男'
				},

				]
			} ]
		};  
		myChart1.setOption(option1);
	});
	//刷新扇形图
	function refreshData1(datas1){ 
		if(!myChart1){
	          return;
	     } 
	     //更新数据 
	      var options1 = myChart1.getOption();
	      options1.series[0].data[0].value = datas1[0];  
	      options1.series[0].data[1].value = datas1[1];  
	      //重新给myChart赋值
	      myChart1.setOption(options1); 
	} 
</script>
<script>
var myChart;
var test=10
	 // 路径配置
	require.config({
		paths : {
			echarts : './assets/dist'
		}
	});
	// 使用
	require([ 'echarts', 'echarts/chart/bar' ], // 使用柱状图就加载bar模块，按需加载
	function(ec) {
		// 基于准备好的dom，初始化echarts图表
		 myChart = ec.init(document.getElementById('main2'));
		var option = {
			title : {
				text : '用户年龄男女比例',
				subtext : ' '
			},
			color: ['#4cabce', '#e5323e'],
			tooltip : {
				trigger : 'axis' 
			}, 
			calculable : true,
			xAxis : [ {
				type : 'category',
				 axisTick: {show: false},
		         data: ['0~15', '15~30', '30~50', '50~70']
			} ],
			yAxis : [ {
				type : 'value'//改设置不显示坐标区域内的y轴分割线
			} ], 
			series : [ {
				name : '男',
				type : 'bar',
				data : [allAdmin().rown15,allAdmin().rown30,allAdmin().rown50,allAdmin().rown100],
				markPoint : {
					data : [ {
						type : 'max',
						name : '最大值'
					} ]
				},
				markLine : {
					data : [ {
						type : 'average',
						name : '平均值'
					} ]
				}
			},
			{
				name : '女',
				type : 'bar',
				data : [allAdmin().row15,allAdmin().row30,allAdmin().row50,allAdmin().row100],
				markPoint : {
					data : [ {
						type : 'max',
						name : '最大值'
					} ]
				},
				markLine : {
					data : [ {
						type : 'average',
						name : '平均值'
					} ]
				}
			}
			]
		};
		// 为echarts对象加载数据 
		myChart.setOption(option);
	});
	//刷新树状图
	function refreshData(data){
	     if(!myChart){
	          return;
	     } 
	     //更新数据
	      var option = myChart.getOption(); 
	      option.series[0].data = data[0];  
	      option.series[1].data = data[1];  
	      //重新给myChart赋值
	      myChart.setOption(option);    
	}
	//查询点击事件
search_flight1(){  
			//刷新树状图
			var data1=new Array(allAdmin().rown15,allAdmin().rown30,allAdmin().rown50,allAdmin().rown100);
			var data2=new Array(allAdmin().row15,allAdmin().row30,allAdmin().row50,allAdmin().row100);
			var data=new Array(data1,data2);
			refreshData(data); 
			//刷新扇形图
			var datas1=new Array(allAdmin().rownv,allAdmin().rownan);
			refreshData1(datas1);
		}
		//向后台action获取数据
		function allAdmin() {
	var dat; 
	$.ajax({
		url :‘adminAction.action',
		data : {
			'methodName' : 'queryAdmin',
			'post':$('#post').val()
		},
		dataType : 'json',
		type : 'post',
		async : false,
		success : function(data) {  
			 dat = data;  
		}
	}); 
	return dat; 
}
</script>