echarts折线图有两个图例时如何实现分别采用两个不同单位的y轴
（1）做法为在series中添加yAxisIndex: 1,这个就可以，默认为yAxisIndex: 0,
【echarts折线图有两个图例时如何实现分别采用两个不同单位的y轴】（2）下面贴出来完整的代码
option = {
backgroundColor : 'rgba(43, 62, 75, 0.5)',//背景颜色
title : {
text : '引流实体',
x : 'center',
textStyle : {
color : '#FFF'
}
},
dataZoom: [//给x轴设置滚动条
{
start:dataZoom_end,
end: 100,
type: 'slider',
show: true,
xAxisIndex: [0],
height: 15,//组件高度
showDetail: false,//即拖拽时候是否显示详细数值信息 默认true
},
//下面这个属性是里面拖到
{
type: 'inside',
show: true,
xAxisIndex: [0],
start:dataZoom_end,
end: 100,
},
],
tooltip : {
trigger: 'axis',
axisPointer : {// 坐标轴指示器，坐标轴触发有效
type : 'line'// 默认为直线，可选为：'line' | 'shadow'
}
},
grid : {//间距距离左右下
//top: '50',
bottom: '45',
left : '1%',
right : '1%',
containLabel : true
},
legend: {
data:['掌上营业厅相关内容点击量','环比增幅'],
textStyle : {
color : '#FFF',
fontSize : 14
},
top:30
},
calculable : true,
xAxis : [
{
type : 'category',
data : dates,
splitLine : {//去掉网格线
show : false
},
axisLine : {//坐标轴轴线相关设置。
show : false,
lineStyle : {
color : '#FFF'
}
},
axisTick : {//坐标轴刻度相关设置
lineStyle : {
color : '#FFF'
}
},
axisLabel: {//x轴文字显示不全并将文字倾斜
interval:0,
rotate:40
}
}
],
yAxis : [
{
type : 'value',
name : '点击量（次）',
axisLabel : {
formatter: '{value}'
},
/*splitLine : {//去掉网格线
show : false
},*/
axisLine : {//坐标轴轴线相关设置。
show : false,
lineStyle : {
color : '#FFF'
}
},
axisTick : {//坐标轴刻度相关设置
show : false,
lineStyle : {
color : '#FFF'
}
},
},
{
type : 'value',
name: '环比增幅（pp%）',
axisLabel : {
formatter: '{value}%'
},
splitLine : {//去掉网格线
show : false
},
axisLine : {//坐标轴轴线相关设置。
show : false,
lineStyle : {
color : '#FFF'
}
},
axisTick : {//坐标轴刻度相关设置
show : false,
lineStyle : {
color : '#FFF'
}
},
}
],
series : [
{
name:'掌上营业厅相关内容点击量',
type:'bar',
data:values,
itemStyle : {
normal : {
color:'#ccecff',
label : {
textStyle : {
fontSize : '15',//柱状上的显示的文字
color:'#0fdc97'
}
}
}
},
},
{
name:'环比增幅',
type:'line',
yAxisIndex: 1,
data:val_float,
itemStyle : {
normal : {
color:'#fe9484',
label : {
textStyle : {
fontSize : '15',//柱状上的显示的文字
color:'#0fdc97'
}
}
}
},
}
]
};
推荐阅读
- 【Thesewt】蒙昧（续）
- 青春的恋习曲
- 诗‖失德
- 一波三折的周日
- 26天
- 夜……
- 从演员的诞生张棪琰的表现看挫折商的重要性
- 计划生育科里的那些事（1）——神转折大赛
- 戒烟（算了，别折磨自己了！）
- 折印