echarts折线双Y双X要求Y轴中间请写一个实例
时间: 2024-05-12 19:17:06 浏览: 92
好的,以下是一个双Y轴、双X轴的Echarts折线图实例,其中Y轴中间有一条实线用于分隔两个Y轴的值范围:
```
var option = {
xAxis: [
{
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月'],
boundaryGap: false,
axisLine: {
lineStyle: {
color: '#666'
}
},
splitLine: {
show: true,
lineStyle: {
color: '#eee'
}
}
},
{
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月'],
position: 'bottom',
boundaryGap: false,
axisLine: {
lineStyle: {
color: '#666'
}
},
splitLine: {
show: true,
lineStyle: {
color: '#eee'
}
}
}
],
yAxis: [
{
type: 'value',
name: 'Y1',
axisLabel: {
formatter: '{value} °C'
},
axisLine: {
lineStyle: {
color: '#666'
}
},
splitLine: {
show: true,
lineStyle: {
color: '#eee'
}
}
},
{
type: 'value',
name: 'Y2',
axisLabel: {
formatter: '{value} mm'
},
axisLine: {
lineStyle: {
color: '#666'
}
},
splitLine: {
show: true,
lineStyle: {
color: '#eee'
}
}
},
{
type: 'value',
name: '',
position: 'right',
axisLine: {
lineStyle: {
color: '#666'
}
},
splitLine: {
show: false
},
axisTick: {
show: false
}
}
],
series: [
{
name: 'Y1',
type: 'line',
data: [2, 4, 7, 2, 5, 3],
yAxisIndex: 0,
lineStyle: {
color: '#0099cc'
},
itemStyle: {
color: '#0099cc'
}
},
{
name: 'Y2',
type: 'line',
data: [70, 20, 60, 80, 30, 90],
yAxisIndex: 1,
lineStyle: {
color: '#c12e34'
},
itemStyle: {
color: '#c12e34'
}
}
]
};
```
注意:以上代码只是一个基本的示例,还需要根据具体需求进行适当的配置和调整。
阅读全文