182 lines
4.3 KiB
JavaScript
182 lines
4.3 KiB
JavaScript
|
||
|
||
export default function dtOption(doubleData) {
|
||
console.log("doubleData", doubleData);
|
||
const maxRz = Math.ceil(Math.max(...doubleData?.detailVos?.map(o => o.rz)))
|
||
const minRz = Math.floor(Math.min(...doubleData?.detailVos?.map(o => o.rz)))
|
||
const maxcy = Math.ceil(Math.max(...doubleData?.detailVos?.map(o => o.value)))
|
||
const mincy = Math.floor(Math.min(...doubleData?.detailVos?.map(o => o.value)))
|
||
console.log(maxRz,minRz,maxcy,mincy);
|
||
// 字体颜色
|
||
const textColor = '#666'
|
||
return {
|
||
title: {
|
||
text: `${doubleData?.stationCode}测压管水位过程线`,
|
||
bottom: "5%",
|
||
left: "40%",
|
||
textStyle: {
|
||
fontWeight: "normal",
|
||
fontSize:14
|
||
}
|
||
},
|
||
toolbox: {
|
||
show: true,
|
||
feature: {
|
||
saveAsImage: {
|
||
show: true,
|
||
excludeComponents: ['toolbox'],
|
||
pixelRatio: 2,
|
||
name:`${doubleData?.stationCode}测压管水位过程线`
|
||
}
|
||
},
|
||
right: "20%",
|
||
top:"5%"
|
||
},
|
||
legend: {
|
||
top: "4%",
|
||
y: "center",
|
||
itemWidth: 30,
|
||
itemHeight: 15,
|
||
itemGap: 15,
|
||
textStyle: {
|
||
fontSize: 12,
|
||
color: "#000",
|
||
padding: [0, 0, 0, 6],
|
||
},
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
grid: {
|
||
top: '20%',
|
||
left: '5%',
|
||
right: '10%',
|
||
bottom: '20%',
|
||
containLabel: true
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
data:doubleData?.detailVos?.map(s =>s.tm),
|
||
axisLabel: {
|
||
// 坐标轴字体颜色
|
||
color: textColor,
|
||
fontSize: 18
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: textColor
|
||
}
|
||
},
|
||
axisTick: {
|
||
// y轴刻度线
|
||
show: true
|
||
},
|
||
splitLine: {
|
||
// 网格
|
||
show: false
|
||
},
|
||
boundaryGap: false
|
||
},
|
||
yAxis: [
|
||
{
|
||
type: 'value',
|
||
min: mincy,
|
||
max: maxcy,
|
||
name: '测压管水位（m）',
|
||
nameTextStyle: {
|
||
color: '#333',
|
||
fontSize: 18,
|
||
padding: [0, 0, 0, 80]
|
||
},
|
||
axisLabel: {
|
||
// 坐标轴字体颜色
|
||
color: textColor,
|
||
fontSize: 18
|
||
},
|
||
axisLine: {
|
||
show: true
|
||
},
|
||
axisTick: {
|
||
// y轴刻度线
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
// 网格
|
||
show: true,
|
||
lineStyle: {
|
||
color: '#CCCCCC',
|
||
type: 'dashed'
|
||
}
|
||
}
|
||
},
|
||
{
|
||
type: 'value',
|
||
min: minRz,
|
||
max: maxRz,
|
||
name: '库水位（m）',
|
||
nameTextStyle: {
|
||
color: '#333',
|
||
fontSize: 18,
|
||
padding: [0, 0, 0, 80]
|
||
},
|
||
axisLabel: {
|
||
// 坐标轴字体颜色
|
||
color: textColor,
|
||
fontSize: 18
|
||
},
|
||
axisLine: {
|
||
show: true
|
||
},
|
||
axisTick: {
|
||
// y轴刻度线
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
// 网格
|
||
show: true,
|
||
lineStyle: {
|
||
color: '#CCCCCC',
|
||
type: 'dashed'
|
||
}
|
||
}
|
||
},
|
||
],
|
||
|
||
series: [
|
||
{
|
||
name: doubleData?.stationCode,
|
||
type: 'line',
|
||
yAxisIndex: 0,
|
||
symbol: 'circle',
|
||
smooth: true,
|
||
symbolSize: 5,
|
||
z: 1,
|
||
itemStyle: {
|
||
color: "#56c0c2"
|
||
},
|
||
lineStyle: {
|
||
color: "#56c0c2"
|
||
},
|
||
data: doubleData?.detailVos?.map(s =>s.value)
|
||
|
||
},
|
||
{
|
||
name: `库水位`,
|
||
type: 'line',
|
||
yAxisIndex: 1,
|
||
symbol: 'circle',
|
||
smooth: true,
|
||
symbolSize: 5,
|
||
z: 1,
|
||
itemStyle: {
|
||
color: "#4c9bef"
|
||
},
|
||
lineStyle: {
|
||
color: "#4c9bef"
|
||
},
|
||
data: doubleData?.detailVos?.map(s =>s.rz)
|
||
}
|
||
]
|
||
};
|
||
|
||
} |