tsg-web/src/views/gcaqjc/gcaqfx/jrx/jrxOptions.js

export default function jrxOptions(data = {}, type = "1",typeName='1') {
   // debugger
   const yMin = type == "3" ? 70 : type == "2" ? 67 : 
                  type == '1' ? 59 : 70;
   const yMax = type == "3" ? 129 : type == "2" ? 117 
   : type == "1" ? 118 : 150;
   const type1 = ["UPD1", "UPD4", "UPD10", "UPD16"];
   const type2 = ["UPD7", "UPD13"];
   const type3 = ["UPD2", "UPD5", "UPD8", "UPD17"];
   const type4 = ["UPD11", "UPD14"];
   const type5 = ["UPD3", "UPD6", "UPD9"];
   const type6 = ["UPD12", "UPD15"];

   // 管底高程

   const alltype = typeName == "1" ? type1 :
      typeName == "2" ? type2 :
         typeName == "3" ? type3 :
            typeName == "4" ? type4 :
               typeName == "5" ? type5 :
               typeName == "6" ? type6 :[]
      ;

   // 字体颜色
   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 imageUrl = type == "1" ? imageUrl130 :
      type == "2" ? imageUrl250 : 
      type == "3" ? imageUrl370 : imageUrl370
      ;
   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 - 99) + 1 * 14) / 1)
   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, 99], [14, 99], [xValue, data?.rz]]
      :
      []
   // gz1、gz2、gz3、gz4分别为渗压管
   const gz1 = data[alltype[0]] ?
      type == "3" ? [[47, typeName =='5' ?76.56:92.18], [47, data[alltype[0]]]] :
         type == "2" ? [[45.5, typeName =='3' ?76.16:77.18], [45.5, data[alltype[0]]]] :
         type == "1" ? [[44, typeName =='1' ?79.16:77.18], [44, data[alltype[0]]]] :
            [[47.5, 158], [85, data[alltype[0]]]]
      : [];
   
   const gz2 = data[alltype[1]] ?
      type == "3" ? [[51, typeName =='5' ?77.18:83.50], [51, data[alltype[1]]]] :
         type == "2" ? [[50, typeName =='3' ?77.18:77.50], [50, data[alltype[1]]]] :
         type == "1" ? [[51.5, typeName =='1' ?77.18:74.5], [51.5, data[alltype[1]]]] :
            [[53.6, 158], [53.6, data[alltype[1]]]] :
      [];

   const gz3 = data[alltype[2]] ?
      type == "3" ? [[58.5, 81.50], [58.5, data[alltype[2]]]] :
         type == "2" ? [[58, 80.50], [58, data[alltype[2]]]] :
         type == "1" ? [[58, 66.50], [58, data[alltype[2]]]] :
            [[73, 161], [73, data[alltype[2]]]] : [];
   
   
   const gz4 = data[alltype[3]] ?
      type == "3" ? [] :
         type == "2" ? [[77, 73.50], [77, data[alltype[3]]]] :
         type == "1" ? [[79, 72.50], [79, data[alltype[3]]]] :
            [[85, 166], [85, data[alltype[3]]]] : [];
   
   // 将渗压管连起来的线
   const line = data?.rz ?
      type == "3" ?
         [
            [xValue, data?.rz],
            [47, data[alltype[0]]],
            [51, data[alltype[1]]],
            [58.5, data[alltype[2]]],
           
         ] :
         type == "2" ?
            [
               [xValue, data?.rz],
               [45.5, data[alltype[0]]],
               [50, data[alltype[1]]],
               [58, data[alltype[2]]],
               [77, data[alltype[3]]]
            ] :
            type == "1"?
            [
               [xValue, data?.rz],
               [44, data[alltype[0]]],
               [51.5, data[alltype[1]]],
               [58, data[alltype[2]]],
               [79, data[alltype[3]]]
            ]:
            [
               [xValue, data?.rz],
               [51.6, data[alltype[0]]],
               [53.6, data[alltype[1]]],
               [73, data[alltype[2]]],
               [85, data[alltype[3]]]
            ]
      : []
   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: '#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
         },
      ]
   };

}