折线柱状图结合，两个Y轴ECharts Gallery

20:11:45图表已生成
代码
var data1= ['50', '60', '30']
var data2= ['40', '60', '20']
var data3= ['30', '50', '10']
var data4= ['40', '60', '20']
var data5= ['30', '50', '10']
option={
    backgroundColor:"#fff",
	tooltip: {
// 		trigger: 'axis',
// 		axisPointer: {            // 坐标轴指示器，坐标轴触发有效
// 			type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
// 		}
	},
	legend: {
		show:false
	},
// 	年度完成率和季度完成率颜色
	color:['#071960','#1740B4','#1962CA','#F87A0F','#FF3574'],
	grid: {
		left: '3%',
		right: '4%',
		top:'10%',
		bottom: '3%',
		containLabel: true
	},
	xAxis: [
		{
			type: 'category',
			axisLine: {
				lineStyle: {
					color: '#1B3F81'
				}
			},
			axisLabel: { //坐标轴刻度标签的相关设置。
				interval: 0,//设置为 1，表示『隔一个标签显示一个标签』
				margin:15,
				textStyle: {
					color: '#6B9DD7',
					fontStyle: 'normal',
					fontSize: 14,
				}
			},
			data: ['第一次', '第二次', '第三次']
		}
	],
	yAxis: [
		{
			type: 'value',
			axisLabel: { //坐标轴刻度标签的相关设置。
				interval: 0,//设置为 1，表示『隔一个标签显示一个标签』
				margin:15,
				textStyle: {
					color: '#6B9DD7',
					fontStyle: 'normal',
					fontFamily: '微软雅黑',
					fontSize: 14,
				}
			},
			axisLine: {
				lineStyle: {
					color: '#1B3F81'
				}
			},
			splitLine: {
				lineStyle: {
					color: "#1B3F81",
				},
			},
		},
        {
            name: '比率(%)',
            // 单位 显示位置
            // nameLocation: 'start',
            
            type: 'value',
			axisLabel: { //坐标轴刻度标签的相关设置。
				interval: 0,//设置为 1，表示『隔一个标签显示一个标签』
				margin:15,
                formatter: '{value}%',
				textStyle: {
					color: '#6B9DD7',
					fontStyle: 'normal',
					fontFamily: '微软雅黑',
					fontSize: 14,
				}
			},
			axisLine: {
				lineStyle: {
					color: '#1B3F81'
				}
			},
			splitLine: {
				lineStyle: {
					color: "#1B3F81",
				},
			},
        }
	],
	series: [
		{
			name: '年度指标',
			type: 'bar',
            yAxisIndex:0,
			barWidth:'40px',
			itemStyle: {
                normal: {
                    show: true,
                    borderWidth: 0,
                }
            },
			data:data1
		},
		{
			name: '季度指标',
			type: 'bar',
            yAxisIndex: 0,
			itemStyle: {
                normal: {
                    show: true,
                    borderWidth: 0,
                }
            },
			barWidth:'40px',
			data: data2
		},
		{
			name: '完成值',
			type: 'bar',
            yAxisIndex: 0,
			barWidth:'40px',
			itemStyle: {
                normal: {
                    show: true,
                    borderWidth: 0,
                }
            },
			data: data3
		},{
            name:'年度完成率',
            type:'line',
            yAxisIndex: 1,
            symbolSize:6,
			data: data4
        },{
            name:'季度完成率',
            type:'line',
            yAxisIndex: 1,
            symbolSize:6,
            data:data5
        },
         {
            name: '访问来源',
            type: 'pie',
            z:100,
            radius : '28%',
            center: ['75%', '30%'],
//          data:['衬衫','羊毛衫','雪纺衫','裤子','高跟鞋','袜子']
//          data: [5, 20, 36, 10, 10, 20]

            data:[
                {value:5, name:'第一次',itemStyle: {color: '#0F9AF8'}},
                {value:20, name:'第二次',itemStyle: {color: '#2B63D5'}},
                {value:36, name:'第三次',itemStyle: {color: '#2039C3'}},
            ],
            itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }

	]
};
	
作品使用的第三方脚本

数据管理

历史数据 0 条

代码修改记录

信息提示

保存作品
