我是在官网的例子进行修改的,大家可以直接把代码粘贴进去就可以看了
option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
}
},
toolbox: {
feature: {
dataView: {show: true, readOnly: false},
magicType: {show: true, type: ['line', 'bar']},
restore: {show: true},
saveAsImage: {show: true}
}
},
grid: [
//0降雨
{x: '7%', y: '7%', height: '20%', left: '10%'},
//1水位流量
{x: '7%', y2: '7%',top:"middle", height: '20%', left: '10%',},
{x: '7%', y3: '7%', height: '20%', left: '10%',bottom:'10%' }
],
legend: {
data:['蒸发量','平均温度','蒸发量1','平均温度1','蒸发量2','平均温度2']
},
xAxis: [
{
type: 'category',
data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
axisPointer: {
type: 'shadow'
}
},{
type: 'category',
gridIndex: 1,//对应前面grid的索引位置(第2个)
axisTick: {
alignWithLabel: true
},
data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
axisPointer: {
type: 'shadow'
}
},
{
type: 'category',
gridIndex: 2,//对应前面grid的索引位置(第3个)
axisTick: {
alignWithLabel: true
},
data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
axisPointer: {
type: 'shadow'
}
}
],
yAxis: [
{
type: 'value',
name: '蒸发量',
gridIndex: 0,
splitLine: {show: false},
axisLabel: {
formatter: '{value} ml'
}
},
{
type: 'value',
name: '平均温度',
gridIndex: 0,
splitLine: {show: false},
axisLabel: {
formatter: '{value} °C'
}
},
{
type: 'value',
name: '蒸发量1',
gridIndex:1,
splitLine: {show: false},
axisLabel: {
formatter: '{value} ml'
}
},
{
type: 'value',
name: '平均温度1',
gridIndex: 1,
splitLine: {show: false},
axisLabel: {
formatter: '{value} °C'
}
},
{
type: 'value',
name: '蒸发量2',
gridIndex:2,
splitLine: {show: false},
axisLabel: {
formatter: '{value} ml'
}
},
{
type: 'value',
name: '平均温度2',
gridIndex: 2,
splitLine: {show: false},
axisLabel: {
formatter: '{value} °C'
}
}
],
series: [
{
name:'蒸发量',
type:'line',
xAxisIndex: 0,
yAxisIndex: 0,
data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
},
{
name:'平均温度',
type:'line',
xAxisIndex: 0,
yAxisIndex: 1,
data:[2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
},{
name:'蒸发量1',
type:'line',
xAxisIndex: 1,
yAxisIndex: 2,
data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
},
{
name:'平均温度1',
type:'line',
xAxisIndex: 1,
yAxisIndex: 3,
data:[2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
},{
name:'蒸发量2',
type:'line',
xAxisIndex: 2,
yAxisIndex: 4,
data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
},
{
name:'平均温度2',
type:'line',
xAxisIndex: 2,
yAxisIndex: 5,
data:[2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
}
]
};