xytSk-App/pages/rainDetail/jcsj/chartOption.js

181 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.map(item => item.substr('2020--'.length)),
splitLine: {
show: false
},
axisLabel: {
color: '#333',
fontSize: 12,
formatter: val => val.substr('2020-'.length, 11)
},
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
}
}