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

最新推荐文章于 2024-08-09 17:10:29 发布

xieyuanqiu

最新推荐文章于 2024-08-09 17:10:29 发布

阅读量4.6k

点赞数

本文链接：https://blog.csdn.net/qq_23157491/article/details/79225375

版权

该博客介绍了一个使用Echarts实现柱状图与折线图相互转换的实例，通过AJAX动态请求后台数据。在获取到每日活跃用户总数后，展示在图表上，提供了一种数据可视化的解决方案。

摘要由CSDN通过智能技术生成

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