this.value = [
[0, 0],
[10, 788],
[30, 3663],
[50, 7038],
[100, 16776]
];
this.value2 = [
[0, 0],
[10, 4500],
[30, 13500],
[50, 22500],
[100, 45000]
];
const showLabel = 7038;
const showLabel2 = 22500;
option = {
title: {
text: '收入利润曲线(万元)'
},
tooltip: {
trigger: 'axis'
},
xAxis: {
name: '用户数(万)',
nameLocation: 'middle'
},
yAxis: [{
type: "value",
//name: "数量",
// interval: 10,
show: true,
min: 0,
max: 60000,
nameTextStyle: {
color: "#000"
},
axisLabel: {
textStyle: {
color: "#000"
}
},
},
{
type: "value",
//name: "挂起后通过比例",
position: "right",
min: 0,
max: 18000,
show: true
}],
series: [
{
itemStyle: { normal: { label: { show: true } } },
name: '利润',
showAllSymbol: true,
data: this.value.map(item => {
return {
value: item,
label: {
show: true,
position: item[1] < showLabel ? 'bottom' : 'top'
}
}
}),
type: 'line',
yAxisIndex: 1,
smooth: true
},
{
itemStyle: { normal: { label: { show: true } } },
name: '收入',
showAllSymbol: true,
data: this.value2.map(item => {
return {
value: item,
label: {
show: true,
position: item[1] < showLabel2 ? 'top' : 'bottom'
}
}
}),
type: 'line',
smooth: true
}
]
};
Axis的yAxisIndex属性 echarts配置多个y轴的时候,需要加上: yAxisIndex;
series数据中,yAxisIndex值为0对应的y轴是yAxis对应的第一条y轴;
series数据中,yAxisIndex值为1 对应的y轴是yAxis对应的第二条y轴;
const showLabel = 7038; position: item[1] < showLabel2 ? ‘top’ : ‘bottom’ :当折线图有交点时,数值小于7038,标题在顶部。数值大于7038标题在底部;