1
This commit is contained in:
@ -1,10 +1,15 @@
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
export let option1 = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross'
|
||||
}
|
||||
},
|
||||
// 图例
|
||||
legend: {
|
||||
top: '0px',
|
||||
right: '20px',
|
||||
top: '1%',
|
||||
itemWidth: 12,
|
||||
itemHeight: 12,
|
||||
textStyle: {
|
||||
@ -20,20 +25,15 @@ export let option1 = {
|
||||
// 网格
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '3%',
|
||||
bottom: '3%',
|
||||
right: '5%',
|
||||
bottom: '5%',
|
||||
top: '15%',
|
||||
containLabel: true
|
||||
},
|
||||
// X轴
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
boundaryGap: true,
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
@ -41,7 +41,7 @@ export let option1 = {
|
||||
color: '#fff',
|
||||
fontSize: 12
|
||||
},
|
||||
data: ['00:00', '03:00', '06:00', '09:00', '12:00', '15:00', '18:00', '21:00', '24:00']
|
||||
data: ['00:00', '06:00', '12:00', '18:00', '24:00']
|
||||
},
|
||||
// Y轴
|
||||
yAxis: {
|
||||
@ -149,10 +149,15 @@ export let option1 = {
|
||||
};
|
||||
|
||||
export let option2 = {
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'cross'
|
||||
}
|
||||
},
|
||||
// 图例
|
||||
legend: {
|
||||
top: '10px',
|
||||
right: '20px',
|
||||
top: '3%',
|
||||
itemWidth: 12,
|
||||
itemHeight: 12,
|
||||
textStyle: {
|
||||
@ -160,7 +165,7 @@ export let option2 = {
|
||||
fontSize: 14
|
||||
},
|
||||
data: [
|
||||
{ name: '发电量', itemStyle: { color: '#00f5a6' } },
|
||||
{ name: '发电量', itemStyle: { color: 'rgba(125, 255, 253, 1)' } },
|
||||
{ name: '发电趋势', itemStyle: { color: '#ffa500' } }
|
||||
]
|
||||
},
|
||||
@ -168,18 +173,14 @@ export let option2 = {
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '3%',
|
||||
bottom: '3%',
|
||||
top: '15%',
|
||||
bottom: '5%',
|
||||
top: '30%',
|
||||
containLabel: true
|
||||
},
|
||||
// X轴
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff'
|
||||
}
|
||||
},
|
||||
boundaryGap: true,
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
@ -207,15 +208,13 @@ export let option2 = {
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: 'rgba(255,255,255,0.2)'
|
||||
color: 'rgba(255,255,255,0.3)'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#fff',
|
||||
fontSize: 14
|
||||
},
|
||||
min: 0,
|
||||
max: 5000,
|
||||
interval: 1000
|
||||
},
|
||||
// 系列
|
||||
@ -232,9 +231,9 @@ export let option2 = {
|
||||
x2: 0,
|
||||
y2: 1,
|
||||
colorStops: [{
|
||||
offset: 0, color: 'rgba(0, 245, 166, 0.8)'
|
||||
offset: 0, color: 'rgba(125, 255, 253, 1)'
|
||||
}, {
|
||||
offset: 1, color: 'rgba(0, 245, 166, 0.2)'
|
||||
offset: 1, color: 'rgba(225, 255, 255, 0)'
|
||||
}]
|
||||
},
|
||||
borderRadius: [4, 4, 0, 0]
|
||||
@ -272,35 +271,49 @@ export let option3 = {
|
||||
},
|
||||
legend: {
|
||||
data: ['光照度', '功率'],
|
||||
top: '5%',
|
||||
top: '1%',
|
||||
textStyle: {
|
||||
color: '#fff' // 若背景是深色,确保文字颜色可见
|
||||
color: '#fff',
|
||||
fontSize: 14
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
right: '5%',
|
||||
bottom: '5%',
|
||||
top: '15%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: ['00:00', '03:00', '06:00', '09:00', '12:00', '15:00', '18:00', '21:00', '24:00']
|
||||
boundaryGap: true,
|
||||
axisTick: {
|
||||
show: false
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#fff',
|
||||
fontSize: 12
|
||||
},
|
||||
data: ['00:00', '06:00', '12:00', '18:00', '24:00']
|
||||
},
|
||||
yAxis: {
|
||||
name: '单位: Kwh',
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
formatter: '{value}',
|
||||
fontSize: 20
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff',
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
color: '#fff',
|
||||
fontSize: 12
|
||||
},
|
||||
interval: 6,
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: 'rgba(192, 192, 192, 0.3)',
|
||||
color: 'rgba(255, 255, 255, 0.3)',
|
||||
width: 1,
|
||||
type: [5, 10]
|
||||
type: [4, 3]
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -310,7 +323,7 @@ export let option3 = {
|
||||
type: 'line',
|
||||
data: [5.5, 5, 9, 11, 11.5, 12, 11.8, 12, 13],
|
||||
itemStyle: {
|
||||
color: '#4895ef'
|
||||
color: 'rgba(82, 155, 255, 1)'
|
||||
},
|
||||
areaStyle: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
@ -329,9 +342,9 @@ export let option3 = {
|
||||
{
|
||||
name: '功率',
|
||||
type: 'line',
|
||||
data: [2, 15, 5, 2, 3, 2.5, 3, 4, 5.5],
|
||||
data: [2, 18, 5, 2, 6, 9, 12, 4, 5.5],
|
||||
itemStyle: {
|
||||
color: '#98e6cd'
|
||||
color: 'rgba(125, 255, 253, 1)'
|
||||
},
|
||||
areaStyle: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
|
||||
Reference in New Issue
Block a user