186 lines
3.9 KiB
JavaScript
186 lines
3.9 KiB
JavaScript
import echarts from 'echarts/lib/echarts';
|
|
export default function DrpOption(echartData) {
|
|
|
|
let totalDrp = 0;
|
|
const DRPLEVEL = [10, 20, 50, 100, 250];
|
|
const maxVal = DRPLEVEL.find(o => o > totalDrp);
|
|
const xMaxVal = echartData ?.actual ? DRPLEVEL.find(o => {
|
|
let max = Math.max(...echartData ?.actual || [])
|
|
return o > max
|
|
}) : maxVal
|
|
// const xMaxVal = Math.ceil(Math.max(...echartData.actual)) + 2
|
|
const yMaxVal = echartData ?.actual ? DRPLEVEL.find(o => {
|
|
let max = Math.max(...echartData ?.total)
|
|
return o > max
|
|
}) : maxVal
|
|
let eopts = {
|
|
tooltip: {
|
|
trigger: 'axis',
|
|
},
|
|
grid: {
|
|
x: 40,
|
|
y: 30,
|
|
x2: 30,
|
|
y2: 28,
|
|
borderWidth: 0
|
|
},
|
|
legend: {
|
|
// 显示图例
|
|
show: true,
|
|
// 图例的位置
|
|
data: ['实测', '累计']
|
|
},
|
|
calculable: true,
|
|
xAxis: [{
|
|
type: 'category',
|
|
data: echartData.time,
|
|
splitLine: {
|
|
show: false
|
|
},
|
|
axisLabel: {
|
|
color: '#333',
|
|
fontSize: 12,
|
|
format: "jcDataFormat"
|
|
},
|
|
axisLine: {
|
|
lineStyle: {
|
|
color: '#07a6ff',
|
|
width: 0.5,
|
|
}
|
|
},
|
|
axisTick: {
|
|
show: false,
|
|
},
|
|
}],
|
|
yAxis: [{
|
|
type: 'value',
|
|
position: 'left',
|
|
name: "雨量mm",
|
|
splitLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#07a6ff',
|
|
width: 0.25,
|
|
type: 'dashed'
|
|
}
|
|
},
|
|
axisLabel: {
|
|
color: '#333',
|
|
fontSize: 12,
|
|
},
|
|
axisLine: {
|
|
show: false
|
|
},
|
|
axisTick: {
|
|
show: false,
|
|
},
|
|
min: 0,
|
|
max: xMaxVal
|
|
},
|
|
{
|
|
type: 'value',
|
|
position: 'right',
|
|
name: "累计mm",
|
|
splitLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: '#07a6ff',
|
|
width: 0.25,
|
|
type: 'dashed'
|
|
}
|
|
},
|
|
axisLabel: {
|
|
color: '#333',
|
|
fontSize: 12,
|
|
},
|
|
axisLine: {
|
|
show: false
|
|
},
|
|
axisTick: {
|
|
show: false,
|
|
},
|
|
min: 0,
|
|
max: yMaxVal
|
|
}
|
|
],
|
|
};
|
|
let chartData = {
|
|
series: [{
|
|
name: '实测',
|
|
type: 'bar',
|
|
barWidth: '60%',
|
|
data: echartData.actual,
|
|
itemStyle: {
|
|
normal: {
|
|
barBorderRadius: [3, 3, 0, 0],
|
|
color: new echarts.graphic.LinearGradient(
|
|
0, 0, 0, 1,
|
|
[{
|
|
offset: 0,
|
|
color: '#3876cd'
|
|
},
|
|
{
|
|
offset: 0.5,
|
|
color: '#45b4e7'
|
|
},
|
|
{
|
|
offset: 1,
|
|
color: '#54ffff'
|
|
}
|
|
]
|
|
),
|
|
},
|
|
},
|
|
label: {
|
|
show: false,
|
|
},
|
|
markPoint: {
|
|
data: [{
|
|
type: 'max',
|
|
name: '最大值',
|
|
symbol: 'circle',
|
|
symbolSize: 1,
|
|
symbolOffset: [0, -12]
|
|
}, ]
|
|
},
|
|
},
|
|
{
|
|
yAxisIndex: 1,
|
|
name: '累计',
|
|
type: 'line',
|
|
showSymbol: false,
|
|
label: {
|
|
show: false,
|
|
},
|
|
data: echartData.total,
|
|
lineStyle: {
|
|
normal: {
|
|
width: 1,
|
|
}
|
|
},
|
|
areaStyle: {
|
|
normal: {
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
|
offset: 0,
|
|
color: 'rgba(3, 194, 236, 0.3)'
|
|
}, {
|
|
offset: 0.8,
|
|
color: 'rgba(3, 194, 236, 0)'
|
|
}], false),
|
|
shadowColor: 'rgba(0, 0, 0, 0.1)',
|
|
shadowBlur: 10
|
|
}
|
|
},
|
|
itemStyle: {
|
|
normal: {
|
|
color: '#03C2EC'
|
|
}
|
|
},
|
|
}
|
|
]
|
|
};
|
|
return {
|
|
eopts,
|
|
chartData
|
|
}
|
|
} |