var popt = []
var max75 = [
6.56,
6.51,
6.49,
6.49,
6.53,
6.71,
6.98,
7.19,
7.4,
7.13,
6.82,
6.66,
6.53,
6.96,
7.58,
8.04,
8.36,
7.88,
7.3,
6.88,
6.38,
6.21,
5.97,
5.75,
5.59,
5.8,
6.01,
6.24,
6.33,
6.17,
5.99,
5.75,
5.53,
5.75,
6.08,
6.15,
6.54,
6.55,
6.55,
6.55,
6.45,
6.18,
5.99,
5.76,
5.87,
6.94,
8.02,
9.45,
10.5,
10.39,
10.11,
9.79,
9.5,
9.26,
8.96,
8.72,
8.46,
8.41,
8.45,
8.41,
8.41,
8.44,
8.42,
8.42,
8.37,
7.93,
7.33,
6.9,
6.51,
5.91,
5.43,
4.98,
4.78,
5.55,
6.54,
7.63,
8.28,
7.29,
6.14,
5.36,
4.77,
5.59,
6.64,
7.4,
8.56,
8.76,
8.98,
9.42,
9.63,
9.64,
9.63,
9.64,
9.61,
9.27,
8.97,
8.7
]
var min75 = [];
var max80 = [
6.23,
6.18,
6.16,
6.16,
6.2,
6.37,
6.63,
6.83,
7.03,
6.77,
6.48,
6.32,
6.2,
6.61,
7.2,
7.64,
7.94,
7.49,
6.93,
6.53,
6.06,
5.9,
5.67,
5.46,
5.31,
5.51,
5.71,
5.93,
6.01,
5.86,
5.69,
5.46,
5.25,
5.46,
5.78,
5.84,
6.21,
6.23,
6.23,
6.23,
6.13,
5.87,
5.69,
5.47,
5.57,
6.59,
7.62,
8.98,
9.98,
9.87,
9.6,
9.3,
9.03,
8.79,
8.51,
8.29,
8.04,
7.99,
8.02,
7.99,
7.99,
8.02,
8,
8,
7.96,
7.54,
6.96,
6.56,
6.19,
5.61,
5.16,
4.73,
4.54,
5.27,
6.21,
7.25,
7.87,
6.93,
5.84,
5.09,
4.53,
5.31,
6.31,
7.03,
8.13,
8.32,
8.53,
8.95,
9.15,
9.16,
9.15,
9.16,
9.13,
8.8,
8.52,
8.27
]
var min80 = [];
var max85 = [
5.9,
5.86,
5.84,
5.84,
5.88,
6.04,
6.28,
6.48,
6.66,
6.42,
6.14,
5.99,
5.87,
6.26,
6.82,
7.23,
7.52,
7.09,
6.57,
6.19,
5.74,
5.59,
5.37,
5.17,
5.03,
5.22,
5.41,
5.61,
5.7,
5.56,
5.39,
5.18,
4.98,
5.17,
5.48,
5.54,
5.89,
5.9,
5.9,
5.9,
5.81,
5.56,
5.39,
5.18,
5.28,
6.24,
7.22,
8.5,
9.45,
9.35,
9.09,
8.81,
8.55,
8.33,
8.06,
7.85,
7.61,
7.57,
7.6,
7.57,
7.57,
7.59,
7.58,
7.58,
7.54,
7.14,
6.59,
6.21,
5.86,
5.32,
4.89,
4.48,
4.3,
5,
5.88,
6.87,
7.46,
6.56,
5.53,
4.82,
4.29,
5.03,
5.98,
6.66,
7.7,
7.89,
8.08,
8.48,
8.67,
8.68,
8.67,
8.68,
8.65,
8.34,
8.08,
7.83
]
var min85 = [];
var xData = [
"00:00",
"00:15",
"00:30",
"00:45",
"01:00",
"01:15",
"01:30",
"01:45",
"02:00",
"02:15",
"02:30",
"02:45",
"03:00",
"03:15",
"03:30",
"03:45",
"04:00",
"04:15",
"04:30",
"04:45",
"05:00",
"05:15",
"05:30",
"05:45",
"06:00",
"06:15",
"06:30",
"06:45",
"07:00",
"07:15",
"07:30",
"07:45",
"08:00",
"08:15",
"08:30",
"08:45",
"09:00",
"09:15",
"09:30",
"09:45",
"10:00",
"10:15",
"10:30",
"10:45",
"11:00",
"11:15",
"11:30",
"11:45",
"12:00",
"12:15",
"12:30",
"12:45",
"13:00",
"13:15",
"13:30",
"13:45",
"14:00",
"14:15",
"14:30",
"14:45",
"15:00",
"15:15",
"15:30",
"15:45",
"16:00",
"16:15",
"16:30",
"16:45",
"17:00",
"17:15",
"17:30",
"17:45",
"18:00",
"18:15",
"18:30",
"18:45",
"19:00",
"19:15",
"19:30",
"19:45",
"20:00",
"20:15",
"20:30",
"20:45",
"21:00",
"21:15",
"21:30",
"21:45",
"22:00",
"22:15",
"22:30",
"22:45",
"23:00",
"23:15",
"23:30",
"23:45"
]
for (var i = 0; i < 96; i++) {
min75.push(max75[i] - 7);
min80.push(max80[i] - 5);
min85.push(max85[i] - 4);
popt.push(max85[i] - 2.5);
}
//设置 阴影区间 data
let data75 = [];
let data80 = [];
let data85 = [];
for (var i = 0; i < 96; i++) {
data75.push([xData[i], xData[i + 1], max75[i], max75[i + 1], min75[i], min75[i + 1]]);
data80.push([xData[i], xData[i + 1], max80[i], max80[i + 1], min80[i], min80[i + 1]]);
data85.push([xData[i], xData[i + 1], max85[i], max85[i + 1], min85[i], min85[i + 1]]);
}
var option = {
legend: { top: '5%', textStyle: { color: '#505050', fontSize: '14' } },
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true,
},
xAxis: {
axisLabel: {
textStyle: { color: '#000000' },
},
type: 'category',
boundaryGap: false,
axisLine: { lineStyle: { color: '#727272' }, textStyle: { color: '#000000' } },
data: xData,
},
yAxis: {
name: 'MW',
type: 'value',
axisLabel: {
textStyle: { color: '#000000' },
},
axisTick: { show: false },
splitLine: {
show: false,
},
axisLine: {
show: true,
lineStyle: { color: '#727272' },
textStyle: { color: '#000000' },
},
},
series: [
{
type: 'custom',
data: data75,
name: '75',
renderItem: function renderItem(params, api) {
const x1 = data75[params.dataIndexInside][0];
const x2 = data75[params.dataIndexInside][1];
const topLeft = api.coord([x1, api.value(2)]);
const topRight = api.coord([x2, api.value(3)]);
const bottomRight = api.coord([x2, api.value(5)]);
const bottomLeft = api.coord([x1, api.value(4)]);
return {
type: 'polygon',
shape: {
points: [topLeft, topRight, bottomRight, bottomLeft],
},
style: {
fill: 'rgba(68,241,81,0.1)',
},
};
},
encode: {
x: [0, 1],
y: [2, 3, 4, 5],
},
},
{
type: 'custom',
data: data80,
name: '80',
renderItem: function renderItem(params, api) {
const x1 = data80[params.dataIndexInside][0];
const x2 = data80[params.dataIndexInside][1];
const topLeft = api.coord([x1, api.value(2)]);
const topRight = api.coord([x2, api.value(3)]);
const bottomRight = api.coord([x2, api.value(5)]);
const bottomLeft = api.coord([x1, api.value(4)]);
return {
type: 'polygon',
shape: {
points: [topLeft, topRight, bottomRight, bottomLeft],
},
style: {
fill: 'rgba(68,241,81,0.2)',
},
};
},
encode: {
x: [0, 1],
y: [2, 3, 4, 5],
},
},
{
type: 'custom',
data: data85,
name: '85',
renderItem: function renderItem(params, api) {
const x1 = data85[params.dataIndexInside][0];
const x2 = data85[params.dataIndexInside][1];
const topLeft = api.coord([x1, api.value(2)]);
const topRight = api.coord([x2, api.value(3)]);
const bottomRight = api.coord([x2, api.value(5)]);
const bottomLeft = api.coord([x1, api.value(4)]);
return {
type: 'polygon',
shape: {
points: [topLeft, topRight, bottomRight, bottomLeft],
},
style: {
fill: 'rgba(68,241,81,0.3)',
},
};
},
encode: {
x: [0, 1],
y: [2, 3, 4, 5],
},
},
{
name: '实时值',
type: 'line',
smooth: true,
symbol: 'none',
itemStyle: {
normal: {
color: 'rgb(194,44,89)',
width: 1,
lineStyle: {
width: 2,
type: 'dashed', //'dotted'点型虚线 'solid'实线 'dashed'线性虚线
},
},
},
data: popt,
}
],
};