xytSk-App/pages/aqjc/jrxOptions.js

321 lines
8.0 KiB
JavaScript

import { imageUrl060,imageUrl090,rule } from './dataUrl'
export default function jrxOptions(data = {}, type = "1") {
const yMin = type == "1" ? 147 : type == "2" ? 146 : 146;
const yMax = type == "1" ? 209 : type == "2" ? 210 : 210;
const type1 = ["SY05", "SY06", "SY07", "SY08"]
const type2 = ["SY09","SY10","SY11","SY12"]
const alltype = type == "1" ? type1 : type == "2" ? type2 : type2;
// 字体颜色
const textColor = '#666'
const imageUrl = type == "1" ? imageUrl060:
type == "2" ? imageUrl090 : imageUrl090;
const xValue = type == "1" ? (((data?.rz - 169) + 0.65 * 14) / 0.65):
type == "2" ?(((data?.rz - 169) + 0.85 * 14) / 0.84) :(((data?.rz - 169) + 0.84 * 14) / 0.84)
const rz = data?.rz ?
[[xValue, data?.rz], [0, data?.rz], ] :
[]
const rz1 = data?.rz ?
[[0,169],[14, 169], [xValue, data?.rz]] :
[]
const gz1 = data[alltype[0]] ?
type == "1" ? [[57.6, 158], [57.6, data[alltype[0]]]] :
type == "2" ? [[52.6, 158], [52.6, data[alltype[0]]]] :
[[52.6, 158], [52.6, data[alltype[0]]]]
: [];
const gz2 = data[alltype[1]] ?
type == "1" ? [[60.6, 158], [60.6, data[alltype[1]]]] :
type == "2" ? [[55.6, 158], [55.6, data[alltype[1]]]] :
[[53.6, 158], [53.6, data[alltype[1]]]] :
[];
const gz3 = data[alltype[2]] ?
type == "1" ? [[82, 161], [82, data[alltype[2]]]] :
type == "2" ? [[66.5, 162], [66.5, data[alltype[2]]]] :
[[73, 161], [73, data[alltype[2]]]] : [];
const gz4 = data[alltype[3]] ?
type == "1" ? [[96.6, 166], [96.6, data[alltype[3]]]] :
type == "2" ? [[77, 161], [77, data[alltype[3]]]] :
[[85, 166], [85, data[alltype[3]]]] : [];
const line = data?.rz ?
type == "1" ?
[
[xValue, data?.rz],
[57.6, data[alltype[0]]],
[60.6, data[alltype[1]]],
[82, data[alltype[2]]],
[96.6, data[alltype[3]]]
] :
type == "2" ?
[
[xValue, data?.rz],
[52.6, data[alltype[0]]],
[55.6, data[alltype[1]]],
[66.5, data[alltype[2]]],
[77, data[alltype[3]]]
] :
[
[xValue, data?.rz],
[52.6, data[alltype[0]]],
[55.6, data[alltype[1]]],
[73, data[alltype[2]]],
[85, data[alltype[3]]]
]
: []
let eopts = {
toolbox: {
show: true,
feature: {
saveAsImage: {
show: true,
excludeComponents: ['toolbox'],
pixelRatio: 2,
name:"测值图"
},
},
right: "10%",
top:"4%"
},
graphic: [
{
type: 'image',
left: '5%',
top: 0,
bottom:0,
z: 1,
bounding: 'raw',
style: {
image: imageUrl,
width: 1310,
height: 380
}
},
{
type: 'image',
// id: 'background',
left: '5%',
bottom:"5%",
z: 1,
bounding: 'all',
style: {
image: rule,
width: 10,
height: 450
}
}
],
grid: {
top: '0%',
left: '2%',
right: '5%',
bottom: '0%',
containLabel: true
},
xAxis: {
min: 0,
max:100,
axisLabel: {
show:false,
// 坐标轴字体颜色
color: textColor,
fontSize: 18
},
axisLine: {
show:false,
lineStyle: {
color: textColor
}
},
axisTick: {
// y轴刻度线
show: false
},
splitLine: {
// 网格
show: false
},
boundaryGap: false
},
yAxis: {
type: 'value',
min: yMin,
max: yMax,
interval:5,
// data:[155,160,180,190,210],
nameTextStyle: {
color: '#333',
fontSize: 18,
padding: [0, 0, 0, 80]
},
axisLabel: {
// 坐标轴字体颜色
color: textColor,
fontSize: 18,
showMinLabel: false,
showMaxLabel: false
},
axisLine: {
show: false
},
axisTick: {
// y轴刻度线
show: false
},
splitLine: {
// 网格
show: false,
lineStyle: {
color: '#CCCCCC',
type: 'dashed'
}
}
},
}
let chartData = {
series: [
// 和大坝坡面重合的线 斜率为0.75
{
type: 'line',
symbol: 'none',
symbolSize: 10,
z: 1,
itemStyle: {
color: '#fff'
},
lineStyle: {
color: '#fff'
},
areaStyle: {
origin: "end",
color: 'rgba(0, 128, 255, 0.3)' // 设置区域填充颜色
},
data:[...rz,...rz1]
},
{
type: 'line',
symbol: 'none',
symbolSize: 10,
z: 1,
itemStyle: {
color: '#5487FF'
},
lineStyle: {
color: '#5487FF'
},
markPoint: {
data: [{ type: 'max',x:"20%", coord: [xValue, data?.rz] }],
symbol: 'pin',
symbolSize: [30, 10],
itemStyle: {
color: '#fff', // 标注点颜色
borderColor: '#ffa500', // 标注点边框颜色
borderWidth: 0 // 标注点边框宽度
},
label: {
show: true, // 是否显示标签
formatter: "库水位" +data?.rz + "m", // 标签格式
color: '#5487FF', // 标签文字颜色
fontSize: 12, // 标签文字大小
}
},
data:rz
},
{
type: 'line',
symbol: 'none',
symbolSize: 10,
z: 1,
itemStyle: {
color: '#5487FF'
},
lineStyle: {
color: '#5487FF'
},
data:rz1
},
// 管位
{
type: 'line',
symbol: 'none',
symbolSize: 10,
z: 1,
itemStyle: {
color: '#5487FF'
},
lineStyle: {
color: '#5487FF',
width:6
},
data: gz1
},
{
type: 'line',
symbol: 'none',
symbolSize: 10,
z: 1,
itemStyle: {
color: '#5487FF'
},
lineStyle: {
color: '#5487FF',
width:6
},
data: gz2
},
{
type: 'line',
symbol: 'none',
symbolSize: 10,
z: 1,
itemStyle: {
color: '#5487FF'
},
lineStyle: {
color: '#5487FF',
width:6
},
data: gz3
},
{
type: 'line',
symbol: 'none',
symbolSize: 10,
z: 1,
itemStyle: {
color: '#5487FF'
},
lineStyle: {
color: '#5487FF',
width:6
},
data: gz4
},
// 管位连接线
{
type: 'line',
symbol: 'none',
symbolSize: 10,
z: 1,
itemStyle: {
color: '#5487FF'
},
lineStyle: {
color: '#5487FF',
},
data: line
},
]
}
return {
eopts,
chartData
}
}