option = {
backgroundColor: 'rbg(40,46,72)',
grid: {
left: '5%',
right: '10%',
top: '20%',
bottom: '15%',
containLabel: true
},
tooltip: {
trigger: 'axis',
axisPointer:{
type:'line',
lineStyle:{
color:'rgba(41, 241, 250, 1)',
type: 'solid'
},
}
},
xAxis: [{
type: 'category',
boundaryGap: 1,
axisLine: {
show: false
},
axisLabel: {
color: '#A1A7B3',
textStyle:{
fontSize:'14px',
color:"rgba(255, 255, 255, 0.64)"
}
},
splitLine: {
show: false
},
axisTick: {
show: false
},
data: ['13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00']
}],
yAxis: [{
name:'单位:小时',
nameTextStyle :{
fontSize: '16px',
color:"rgba(255, 255, 255, 0.64)"
},
type: 'value',
padding:5,
// max: 1000,
splitLine: {
show: true,
lineStyle:{
color: ['rgba(199, 199, 200, 0.2)'],
width: 1,
type: 'dashed'
}
},
axisLine: {
show: false,
},
axisLabel: {
show: true,
margin: 30,
textStyle: {
color: '#A1A7B3'
}
},
axisTick: {
show: false
}
},
],
visualMap: { //折线图渐变色对应Y轴渐变色
show: false,
min: 0,
max: 300,
left: 'left',
top: 'bottom',
color: ["rgba(243, 67, 54, 0.4)","rgba(27, 126, 242, 0.5)","rgba(243, 67, 54, 0.6)","rgba(27, 126, 242, 0.8)"],
calculable: true
},
series: [
{
name: '今日',
type: 'line',
smooth:true,
stack: '总量',
symbolSize: 5,
showSymbol:false,
itemStyle: {
normal: {
lineStyle: {
width: 2
},
},
areaStyle: {
//color: '#94C9EC'
color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
{
offset: 0.4,
color: 'rgba(243, 67, 54, 0.5)',
},
{
offset: 1,
color: 'rgba(27, 126, 242, 0.2)',
},
]),
},
},
areaStyle: {
normal: {
color: {
type: 'linear',x: 0,y: 0,x2: 0,y2: 1,
colorStops: [
{
offset: 0, color: 'rgba(243, 67, 54, 0.2)' // 0% 处的颜色
},
{
offset: 0.8, color: 'rgba(58,132,255, 0.5)' // 100% 处的颜色
},
{
offset: 1, color: 'rgba(0,0,0, 0.5)' // 100% 处的颜色
}
],
global: false // 缺省为 false
}
}
},
data: [220, 182, 191, 234, 290, 330, 310]
},
]
};