echarts 柱状图，折线图互转实例（数据动态请求后台）

function initDayChart(){
     
 
	var myChart = echarts.init(document.getElementById('appLoginLogDayChart'));
	myChart.setOption({
     
		title : {
     
			text : '每日活跃用户总数分析',
			left : 'center',
			top : 20,
			textStyle : {
     
				color : '#555'
			}
		},
        tooltip: {
     },
        legend: {
     },
        toolbox : {
     
			show : true,
			feature : {
     
				magicType : {
     
					show : true,
					type : [ 'line', 'bar' ]
				},
				restore : {
     
					show : true
				},
				saveAsImage : {
     
					show : true,
					title : '保存为图片',
					type : 'png',
					lang : [ '点击保存' ]
				}
			}
		},
		grid: {
       
			y2: 140  
		},
        xAxis: {
     
            data: []
        },
        yAxis: [ {
     
			type : 'value',
			name: '人',
			splitArea : {
     
				show : true
			}
		} ],
        series: [{
     
            name: '当日用户总数',
            type: 'bar',
            data: [],
            barWidth : 30,
        }]
    });
	myChart.showLoading();
    var date=[];    
    var nums=[]; 
    
    $.ajax({
     
		url : "indexController/process/getLoginLogData/sumDay",
		type : 'post',
		async : true,
		data : {
     "startDate":$("#startDate").val(),"endDate":$("#endDate").val()},
		success : function(data) {
     
			var rows = data.result;
			for (var i = rows.length-1; i >= 0; i--) {
     
				date.push(rows[i].date);
			}
			for (var i = rows.length-1; i >= 0; i--) {
     
				nums.push(rows[i].countNum);
			}
			myChart.hideLoading();
			myChart.setOption({
             //加载数据图表
                xAxis: {
     
                	name: '日',
                    data: date,
                    type : 'category',
        			axisLabel:{
       
        				interval:0,//横轴信息全部显示  
        				rotate:-45,//-30度角倾斜显示  
        			},  
                },
                series: [{
     
                    data: nums
                }]
            });
		},
		error : function(){
     
			myChart.hideLoading();
		}
	});
}