import pieMonth from "./pieMonth"; export default function jrxOptions(data = {}, type = "1", typeName = '1') { // debugger console.log("data", data); // data.rz = 112 // 根据断面类型确定y轴刻度以及最大和最小 const yMin = type == "3" ? 70 : type == "2" ? 67 : type == '1' ? 59 : 99; const yMax = type == "3" ? 129 : type == "2" ? 117 : type == "1" ? 118 : 116; // 断面上的渗压管 const type1 = ["UPD1", "UPD4", "UPD7", "UPD16"]; const type2 = ["UPD10", "UPD13"]; const type3 = ["UPD2", "UPD5", "UPD8", "UPD17"]; const type4 = ["UPD11", "UPD14"]; const type5 = ["UPD3", "UPD6", "UPD12"]; const type6 = ["UPD9", "UPD15"]; const type7 = ["UPD24", "UPD26", "UPD28"]; //UPD24:109.87,UPD26:109.75,UPD28:109.43 const type8 = ["UPD25", "UPD27", "UPD29"]; //UPD25:109.87,UPD27:109.75,UPD29:109.43 // 管底高程 const alltype = typeName == "1" ? type1 : typeName == "2" ? type2 : typeName == "3" ? type3 : typeName == "4" ? type4 : typeName == "5" ? type5 : typeName == "6" ? type6 : typeName == "7" ? type7 : typeName == "8" ? type8 : []; // 字体颜色 const textColor = '#666' const imageUrl370 = `${process.env.PUBLIC_URL}/assets/images/zb370.png ` const imageUrl250 = `${process.env.PUBLIC_URL}/assets/images/zb250.png ` const imageUrl130 = `${process.env.PUBLIC_URL}/assets/images/zb130.png ` const imageUrl010 = `${process.env.PUBLIC_URL}/assets/images/fb010.png ` const imageUrl = type == "1" ? imageUrl130 : type == "2" ? imageUrl250 : type == "3" ? imageUrl370 : imageUrl010 ; const rule = `${process.env.PUBLIC_URL}/assets/images/ruler.png ` // rz 是最上面那条线 rz1是那条贴近坝面的线 xValue求解的是最上面那条线的末尾横坐标 const xValue = type == "3" ? (((data?.rz - 86) + 0.6 * 5) / 0.6) : type == "2" ? (((data?.rz - 87) + 0.63 * 7) / 0.63) : type == "1" ? (((data?.rz - 88) + 0.7 * 10) / 0.7) : (((data?.rz - 102) + 0.25 * 4) / 0.25) const rz = data?.rz ? [[xValue, data?.rz], [0, data?.rz]] : [] const rz1 = data?.rz ? type == "3" ? [[0, 86], [5, 86], [xValue, data?.rz]] : type == "2" ? [[0, 87], [7, 87], [xValue, data?.rz]] : type == "1" ? [[0, 88], [10, 88], [xValue, data?.rz]] : [[0, 102], [4, 102], [xValue, data?.rz]] : []; // gz1、gz2、gz3、gz4分别为渗压管 // const gz1 = data[alltype[0]] ? // type == "3" ? [[typeName == '5' ? 47 : 51, typeName == '5' ? 90.50 : 81.85], [typeName == '5' ? 47 : 51, data[alltype[0]]]] : // type == "2" ? [[typeName == '3' ? 45.5 : 50, typeName == '3' ? 84.41 : 83.78], [typeName == '3' ? 45.5 : 50, data[alltype[0]]]] : // type == "1" ? [[typeName == '1' ? 44 : 51.5, typeName == '1' ? 80.11 : 78.64], [typeName == '1' ? 44 : 51.5, data[alltype[0]]]] : // [[55, typeName == '7' ? 109.08 : 108.77], [55, data[alltype[0]]]] // : []; // const gz2 = data[alltype[1]] ? // type == "3" ? [[typeName == '5' ? 51 : 62, typeName == '5' ? 90.94 : 84.85], [typeName == '5' ? 51 : 62, data[alltype[1]]]] : // type == "2" ? [[typeName == '3' ? 50 : 61, typeName == '3' ? 84.04 : 81.05], [typeName == '3' ? 50 : 61, data[alltype[1]]]] : // type == "1" ? [[typeName == '1' ? 51.5 : 58, typeName == '1' ? 78.61 : 82.75], [typeName == '1' ? 51.5 : 58, data[alltype[1]]]] : // [[65, typeName == '7' ? 109.32 : 109.36], [65, data[alltype[1]]]] : // []; // const gz3 = data[alltype[2]] ? // type == "3" ? [[62, 92.65], [62, data[alltype[2]]]] : // type == "2" ? [[61, 83.93], [61, data[alltype[2]]]] : // type == "1" ? [[58, 81.38], [58, data[alltype[2]]]] : // [[77, typeName == '7' ? 109.01 : 108.87], [77, data[alltype[2]]]] : []; // const gz4 = data[alltype[3]] ? // type == "3" ? [] : // type == "2" ? [[79, 79.57], [79, data[alltype[3]]]] : // type == "1" ? [[79, 79.09], [79, data[alltype[3]]]] : // [[85, 166], [85, data[alltype[3]]]] : []; // 心墙中心两点(插入到连线中) const xCenter = type === "3" ? 49 : (type === "2" ? 47.5 : (type === "1" ? 47.5 : 60)); // 简化规则:typeName 为 2/4/6 → 渗压管都在右侧;FB0+010/FB0+030(typeName 为 7/8)不绘制心墙连线 const rightSideOnly = ['2', '4', '6'].includes(typeName); const skipCenterLine = ['7', '8'].includes(typeName); // 左/右管取值(右侧优先 alltype[0],无则 alltype[1]) const leftSyg = rightSideOnly ? undefined : data[alltype[0]]; const rightSyg = rightSideOnly ? (data[alltype[0]] ?? data[alltype[1]]) : data[alltype[1]]; let midPts = []; if (!skipCenterLine && data?.rz) { if (leftSyg !== undefined && leftSyg !== null) { const A = leftSyg - 1; const B = (rightSyg !== undefined && rightSyg !== null) ? (rightSyg + 0.5) : undefined; if (B !== undefined) { if (A > B) { midPts = [[xCenter, A], [xCenter, B]]; } else { midPts = [[xCenter, leftSyg], [xCenter, rightSyg]]; } } } else if (rightSyg !== undefined && rightSyg !== null) { // 左边无渗压管:第一个点为(X, 水位-1),第二个点为(X, 右管+0.5) midPts = [[xCenter, data.rz - 1], [xCenter, rightSyg + 0.5]]; } } const baseY1 = type == "3" ? (typeName =='5' ?90.50:81.85) : type == "2" ? (typeName =='3' ?84.41:83.78) : type == "1" ? (typeName =='1' ?80.11:78.64) : (typeName =='7'?109.08:108.77); const baseY2 = type == "3" ? (typeName =='5' ?90.94:84.85) : type == "2" ? (typeName =='3' ?84.04:81.05) : type == "1" ? (typeName =='1' ?78.61:82.75) : (typeName =='7'?109.32:109.36); const baseY3 = type == "3" ? 92.65 : type == "2" ? 83.93 : type == "1" ? 81.38 : (typeName =='7'?109.01:108.87); const baseY4 = type == "3" ? null : type == "2" ? 79.57 : type == "1" ? 79.09 : 166; // 各管的 X(取你原来的 X) const x1 = type == "3" ? (typeName =='5' ?47:51) : type == "2" ? (typeName =='3' ? 45.5:50) : type == "1" ? (typeName =='1' ?44:51.5) : 53.5; const x2 = type == "3" ? (typeName =='5' ?51:63) : type == "2" ? (typeName =='3' ?50:61) : type == "1" ? (typeName =='1' ?51.5:61) : 66; const x3 = type == "3" ? 63 : type == "2" ? 61 : type == "1" ? 61 : 77; const x4 = type == "3" ? null : type == "2" ? 79 : type == "1" ? 81 : 85; // 管口高程(可能为空) const mouth1 = pieMonth[alltype[0]]; const mouth2 = pieMonth[alltype[1]]; const mouth3 = pieMonth[alltype[2]]; const mouth4 = pieMonth[alltype[3]]; // 蓝色段:从“管口(若有)/管底”到 UPD 值 const gz1 = data[alltype[0]] ? [[x1, baseY1], [x1, data[alltype[0]]]] : []; const gz2 = data[alltype[1]] ? [[x2, baseY2], [x2, data[alltype[1]]]] : []; const gz3 = data[alltype[2]] ? [[x3, baseY3], [x3, data[alltype[2]]]] : []; const gz4 = data[alltype[3]] && x4 !== null ? [[x4, baseY4], [x4, data[alltype[3]]]] : []; // 灰色段:从“管底”到“管口”(仅当 mouth 存在) const gk1 = (mouth1 !== null && mouth1 !== undefined) ? [[x1, baseY1], [x1, mouth1]] : []; const gk2 = (mouth2 !== null && mouth2 !== undefined) ? [[x2, baseY2], [x2, mouth2]] : []; const gk3 = (mouth3 !== null && mouth3 !== undefined) ? [[x3, baseY3], [x3, mouth3]] : []; const gk4 = (mouth4 !== null && mouth4 !== undefined && x4 !== null) ? [[x4, baseY4], [x4, mouth4]] : []; // 将渗压管连起来的线(插入 midPts) const line = data?.rz ? type == "3" ? [ [xValue, data?.rz], ...(rightSideOnly ? midPts : []), [typeName == '5' ? 47 : 51, data[alltype[0]]], ...(!rightSideOnly ? midPts : []), [typeName == '5' ? 51 : 63, data[alltype[1]]], [63, data[alltype[2]]], ] : type == "2" ? [ [xValue, data?.rz], ...(rightSideOnly ? midPts : []), [typeName == '3' ? 45.5 : 50, data[alltype[0]]], ...(!rightSideOnly ? midPts : []), [typeName == '3' ? 50 : 61, data[alltype[1]]], [61, data[alltype[2]]], [79, data[alltype[3]]] ] : type == "1" ? [ [xValue, data?.rz], ...(rightSideOnly ? midPts : []), [typeName == '1' ? 44 : 51.5, data[alltype[0]]], ...(!rightSideOnly ? midPts : []), [typeName == '1' ? 51.5 : 61, data[alltype[1]]], [61, data[alltype[2]]], [81, data[alltype[3]]] ] : [ [xValue, data?.rz], ...(rightSideOnly ? midPts : []), [53.5, data[alltype[0]]], ...(!rightSideOnly ? midPts : []), [66, data[alltype[1]]], [77, data[alltype[2]]], [85, data[alltype[3]]] ] : [] const filteredArray = line.filter(subArray => { return subArray.every(item => item !== null && item !== undefined); }); return { toolbox: { show: true, feature: { saveAsImage: { show: true, excludeComponents: ['toolbox'], pixelRatio: 2, name: "测值图" }, }, right: "10%", top: "4%" }, // title: { // show: true, // text: "断面名称", // left: 'center', // bottom: '-5%', // // textStyle: { // }, graphic: [ { type: 'image', // id: 'background', left: 'center', // top: '11%', top: 0, bottom: 0, z: 1, bounding: 'all', style: { image: imageUrl, width: 1100, height: 380 } }, { type: 'image', // id: 'background', left: '7%', bottom: "5%", z: 1, bounding: 'all', style: { image: rule, width: 10, height: 450 } } ], grid: { // top: '10%', // left: '2%', // right: '5%', // bottom: '10%', // containLabel: true 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, formatter: function (value, index, i) { if (index === 0 || value === yMax) { return ''; // 隐藏第一个刻度和最后一个刻度 } else { return value; // 显示其他刻度 } } }, axisLine: { show: false }, axisTick: { // y轴刻度线 show: false }, splitLine: { // 网格 show: false, lineStyle: { color: '#CCCCCC', type: 'dashed' } } }, 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: data?.rz ? true : false, // 是否显示标签 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: 'rgba(154, 160, 166,.4)' }, lineStyle: { color: 'rgba(154, 160, 166,.4)', width: 6 }, data: gk1 }, { type: 'line', symbol: 'none', symbolSize: 10, z: 1, itemStyle: { color: 'rgba(154, 160, 166,.4)' }, lineStyle: { color: 'rgba(154, 160, 166,.4)', width: 6 }, data: gk2 }, { type: 'line', symbol: 'none', symbolSize: 10, z: 1, itemStyle: { color: 'rgba(154, 160, 166,.4)' }, lineStyle: { color: 'rgba(154, 160, 166,.4)', width: 6 }, data: gk3 }, { type: 'line', symbol: 'none', symbolSize: 10, z: 1, itemStyle: { color: 'rgba(154, 160, 166,.4)' }, lineStyle: { color: 'rgba(154, 160, 166,.4)', width: 6 }, data: gk4 }, // 管位 { 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, // smooth: 0.6, // 设置平滑度 // smoothMonotone: 'x', // 保持 x 方向的单调性 itemStyle: { color: '#5487FF' }, lineStyle: { color: '#5487FF', width: 2, // curveness: 0.5 // 增加曲线程度 }, data: filteredArray }, ] }; }