function echart(chart, leftData, rightData) {//leftData是坐标系左边y轴,rightData是右边y轴
var option = {
//网格
grid: {
bottom: 80,
show: true,
// containLabel: true
},
//图例
legend: {
data: [{
name: 'leftData',
textStyle: { //设置颜色
color: '#6076FF',
fontSize: '14',
}
},
{
name: 'rightData',
textStyle: {
color: '#FFC560',
fontSize: '14',
}
}
],
x: 'left',
bottom: 15,
left: 30
},
//x轴
xAxis: {
type: 'category',
boundaryGap: false,
disableGrid: true, //绘制X网格
data: ['', '', '', '', '', '', '', '', ''],
splitLine: {
show: true,
// 改变轴线颜色
lineStyle: {
// 使用深浅的间隔色
color: ['#DDDDDD']
}
},
//去掉刻度
axisTick: {
show: false
},
//去掉x轴线
axisLine: {
show: false
},
},
//y轴
yAxis: [{
name: 'mph',
type: 'value',
min: 0,
// max: 40,
//y标轴名称的文字样式
nameTextStyle: {
color: '#FFC560'
},
//网格线
splitLine: {
show: true,
lineStyle: {
color: ['#DDDDDD']
}
},
//去掉刻度
axisTick: {
show: false
},
//去掉y轴线
axisLine: {
show: false
},
},
{
name: 'g',
type: 'value',
// max: 4,
min: 0,
nameTextStyle: {
color: '#6076FF'
},
//去掉刻度
axisTick: {
show: false
},
//去掉y轴线
axisLine: {
show: false
},
}
],
series: [{
name: 'leftData',
type: 'line',
animation: true, //动画效果
symbol: 'none',
//折线区域
areaStyle: {
//渐变颜色
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: '#6076FF' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(96,118,255,0.1)' // 100% 处的颜色
}],
global: false, // 缺省为 false
},
},
//折线宽度
lineStyle: {
width: 2
},
color: '#6076FF',
data: leftData // 后台传过来的动态数据
//设置固定的数据
// data: [
// 23, 30, 20, 23, 30, 26, 20, 25, 25
// ]
},
{
name: 'rightData',
type: 'line',
yAxisIndex: 1,
animation: true,
symbol: 'none',
areaStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0,
color: '#FFC560' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(255, 197, 96,0.3)' // 100% 处的颜色
}],
global: false, // 缺省为 false
},
},
lineStyle: {
width: 2
},
color: '#FFC560',
data: rightData,//后台传过来的动态数据
//设置固定的数据
// data: [
// 2, 1, 0.5, 0.9, 2, 1.0, 0.6, 2, 0.5
// ]
}]
}
}