import * as echarts from 'echarts';
import useUserStore from '@/store/modules/user';

const pinias = useUserStore();

const chartOption = {
  //排水一张图  管网资产饼图
  floodOneMapPipePie: {
    color: pinias.$state.chartColor,
    legend: {
      top: '20%',
      right: '6%',
      type: 'scroll',
      orient: 'vertical',
      textStyle: {
        color: '#ccc',
        fontSize: 14,
      },
    },
    tooltip: {
      show: true,
    },
    series: [
      {
        type: 'pie',
        radius: ['55%', '75%'],
        center: ['30%', '40%'],
        label: {
          show: false,
          position: 'center',
        },
        labelLine: {
          length: 30,
          show: false,
        },
        data: [
          { value: 135.6, name: '一级主干' },
          { value: 83.5, name: '二级主干' },
          { value: 10.5, name: '支干管网' },
        ],
      },
    ],
  },
  //排水一张图  降雨场次统计饼图
  floodOneMapRainStatic: {
    legend: {
      top: '20%',
      right: '2%',
      type: 'scroll',
      orient: 'vertical',
      textStyle: {
        color: '#ccc',
        fontSize: 14,
      },
    },
    tooltip: {
      show: true,
    },
    series: [
      {
        type: 'pie',
        radius: ['55%', '75%'],
        center: ['30%', '40%'],
        label: {
          show: false,
          position: 'center',
        },
        labelLine: {
          length: 30,
          show: false,
        },
        data: [
          { value: 10, name: '1年1遇' },
          { value: 5, name: '2年1遇' },
          { value: 4, name: '5年1遇' },
          { value: 2, name: '10年1遇' },
        ],
      },
    ],
  },
  // 排水一张图  物联感知管网监测历史趋势
  floodOneMapPipeSupervise: {
    grid: {
      top: '40px',
      left: '45px',
      right: '47px',
      bottom: '40px',
    },
    animation: true,
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['SS', '流量'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: [
      {
        type: 'category',
        boundaryGap: true,
        axisLabel: {
          color: '#00D1FF',
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },

        // prettier-ignore
        data: [' 2:00', ' 3:00', ' 4:00', ' 5:00', ' 6:00', ' 7:00', ' 8:00', ' 9:00', ' 10:00', ' 11:00', ' 12:00', ' 13:00'],
      },
    ],
    yAxis: [
      {
        name: 'SS(mg/l)',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        axisLine: {
          show: false,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        splitLine: {
          //x网格样式
          show: true,
          lineStyle: {
            color: '#00D1FF',
            type: 'dashed',
          },
        },
      },
      {
        name: 'm³/s',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        splitLine: {
          //x网格样式
          show: false,
        },
        axisLine: {
          show: false,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
      },
    ],
    series: [
      {
        name: 'SS',
        type: 'line',
        symbol: 'none',
        smooth: true,
        lineStyle: {
          width: 2,
          color: '#D9D237',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [ 0.5, 0.1, 0.7, 0.9, 0.1, 0.6, 0.3, 0.7, 0.2, 0.8, 0.6,1.2],
      },
      {
        name: '流量',
        type: 'line',
        symbol: 'none',
        yAxisIndex: 1,
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: 'rgba(1, 177, 220, 0.8)', // 0% 处的颜色
              },
              {
                offset: 1,
                color: 'rgba(1, 177, 220, 0.1)', // 100% 处的颜色
              },
            ],
            global: false, // 缺省为 false
          },
        },
        lineStyle: {
          width: 1,
          color: '#01B1DC',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [2, 1.3, 1.4, 2.5, 1.7, 2.0, 1.3, 1.0, 1.6, 0.9, 0.7, 3.4],
      },
    ],
  },
  // 排水一张图  监测告警
  floodOneMapPipeWarns: {
    grid: {
      top: '40px',
      left: '45px',
      right: '47px',
      bottom: '40px',
    },
    animation: true,
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['SS', '流量'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: [
      {
        type: 'category',
        boundaryGap: false,
        axisLabel: {
          color: '#00D1FF',
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },

        // prettier-ignore
        data: [
          ' 2:00', ' 3:00', ' 4:00', ' 5:00', ' 6:00', ' 7:00', ' 8:00', ' 9:00', ' 10:00', ' 11:00', ' 12:00', ' 13:00', ' 14:00', ' 15:00', ' 16:00', ' 17:00', ' 18:00', ' 19:00', ' 20:00', ' 21:00', ' 22:00', ' 23:00', '0:00', ' 1:00'
        ],
      },
    ],
    yAxis: [
      {
        name: 'SS(mg/l)',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        axisLine: {
          show: false,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        splitLine: {
          //x网格样式
          show: true,
          lineStyle: {
            color: '#00D1FF',
            type: 'dashed',
          },
        },
      },
      {
        name: 'm³/s',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        splitLine: {
          //x网格样式
          show: false,
        },
        axisLine: {
          show: false,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
      },
    ],
    series: [
      {
        name: 'SS',
        type: 'line',
        symbol: 'none',
        smooth: true,
        lineStyle: {
          width: 2,
          color: '#D9D237',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          5.5, 5.1, 5.7, 5.9, 6.1, 6.6, 6.3, 6.7, 6.2, 5.8, 5.6, 5.4, 5.2, 5.0, 4.8, 5.3, 5.1, 5.5, 5.2, 5.3, 5.6, 5.8, 6.3, 6.5
        ],
      },
      {
        name: '流量',
        type: 'line',
        symbol: 'none',
        yAxisIndex: 1,
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: 'rgba(1, 177, 220, 0.8)', // 0% 处的颜色
              },
              {
                offset: 1,
                color: 'rgba(1, 177, 220, 0.1)', // 100% 处的颜色
              },
            ],
            global: false, // 缺省为 false
          },
        },
        lineStyle: {
          width: 1,
          color: '#01B1DC',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [10, 13, 13.4, 15, 17, 20, 33, 40, 45, 50, 43.7, 42, 38, 36, 35, 38, 41, 41, 43, 38, 28, 20, 15, 13],
      },
    ],
  },
  //管网监测水位
  floodOneMapPipewater: {
    grid: {
      top: '40px',
      left: '45px',
      right: '47px',
      bottom: '40px',
    },
    animation: true,
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['SS', '流量'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: [
      {
        type: 'category',
        boundaryGap: false,
        axisLabel: {
          color: '#00D1FF',
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },

        // prettier-ignore
        data: [
          ' 2:00', ' 3:00', ' 4:00', ' 5:00', ' 6:00', ' 7:00', ' 8:00', ' 9:00', ' 10:00', ' 11:00', ' 12:00', ' 13:00', ' 14:00', ' 15:00', ' 16:00', ' 17:00', ' 18:00', ' 19:00', ' 20:00', ' 21:00', ' 22:00', ' 23:00', '0:00', ' 1:00'
        ],
      },
    ],
    yAxis: [
      {
        name: 'SS(mg/l)',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        axisLine: {
          show: false,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        splitLine: {
          //x网格样式
          show: true,
          lineStyle: {
            color: '#00D1FF',
            type: 'dashed',
          },
        },
      },
      {
        name: 'm³/s',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        splitLine: {
          //x网格样式
          show: false,
        },
        axisLine: {
          show: false,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
      },
    ],
    series: [
      {
        name: 'SS',
        type: 'line',
        symbol: 'none',
        smooth: true,
        lineStyle: {
          width: 2,
          color: '#D9D237',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          5.5, 5.1, 5.7, 5.9, 6.1, 6.6, 6.3, 6.7, 6.2, 5.8, 5.6, 5.4, 5.2, 5.0, 4.8, 5.3, 5.1, 5.5, 5.2, 5.3, 5.6, 5.8, 6.3, 6.5
        ],
      },
      {
        name: '流量',
        type: 'line',
        symbol: 'none',
        yAxisIndex: 1,
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: 'rgba(1, 177, 220, 0.8)', // 0% 处的颜色
              },
              {
                offset: 1,
                color: 'rgba(1, 177, 220, 0.1)', // 100% 处的颜色
              },
            ],
            global: false, // 缺省为 false
          },
        },
        lineStyle: {
          width: 1,
          color: '#01B1DC',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [10, 13, 13.4, 15, 17, 20, 33, 40, 45, 50, 43.7, 42, 38, 36, 35, 38, 41, 41, 43, 38, 28, 20, 15, 13],
      },
    ],
  },
  //排水一张图  物联感知管网监测统计分析
  floodOneMapPipeStatic: {
    grid: {
      top: '40px',
      left: '40px',
      right: '40px',
      bottom: '40px',
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['白天', '夜间'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: [
      {
        type: 'category',
        boundaryGap: false,
        axisLabel: {
          formatter: '{value} ',
          textStyle: {
            color: '#00D1FF',
          },
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
      },
    ],
    yAxis: [
      {
        name: 'SS(mg/l)',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        formatter: '{value} ',
        axisLine: {
          show: true,

          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        splitLine: {
          //x网格样式
          show: true,
          lineStyle: {
            color: '#00D1FF',
            type: 'dashed',
          },
        },
      },
    ],
    series: [
      {
        name: '白天',
        symbolSize: 5,
        data: [
          ['6:00', 5.5],
          ['7:00', 5.1],
          ['8:00', 5.1],
          ['9:00', 5.7],
          ['10:00', 5.9],
          ['11:00', 6.1],
          ['12:00', 6.6],
          ['13:00', 6.3],
          ['14:00', 6.7],
          ['15:00', 6.2],
          ['16:00', 5.8],
          ['17:00', 5.6],
        ],
        type: 'scatter',
      },
      {
        name: '夜间',
        symbolSize: 5,
        data: [
          ['18:00', 5.4],
          ['19:00', 5.2],
          ['20:00', 5.0],
          ['21:00', 5.5],
          ['22:00', 5.3],
          ['23:00', 5.1],
          ['24:00', 5.2],
          ['1:00', 5.3],
          ['2:00', 5.6],
          ['3:00', 5.3],
          ['4:00', 5.2],
          ['5:00', 6.5],
        ],
        type: 'scatter',
      },
    ],
  },
  //排水一张图  物联感知积水点历史趋势
  floodOneMapJSDTrend: {
    grid: {
      top: '40px',
      left: '40px',
      right: '40px',
      bottom: '40px',
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['积水深度'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      axisLabel: {
        textStyle: {
          color: '#00D1FF',
        },
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      // prettier-ignore
      data: [
        ' 2:00', ' 3:00', ' 4:00', ' 5:00', ' 6:00', ' 7:00', ' 8:00', ' 9:00', ' 10:00', ' 11:00', ' 12:00', ' 13:00', ' 14:00', ' 15:00', ' 16:00', ' 17:00', ' 18:00', ' 19:00', ' 20:00', ' 21:00', ' 22:00', ' 23:00', '2009/6/13 0:00', ' 1:00'
      ],
    },
    yAxis: {
      name: '单位：mm',
      type: 'value',
      textStyle: {
        color: '#00D1FF',
      },
      axisLine: {
        show: false,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      splitLine: {
        //x网格样式
        show: true,
        lineStyle: {
          color: '#00D1FF',
          type: 'dashed',
        },
      },
    },
    series: [
      {
        name: '积水深度',
        type: 'line',
        symbol: 'none',
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: 'rgba(1, 177, 220, 0.8)', // 0% 处的颜色
              },
              {
                offset: 1,
                color: 'rgba(1, 177, 220, 0.1)', // 100% 处的颜色
              },
            ],
            global: false, // 缺省为 false
          },
        },
        lineStyle: {
          width: 1,
          color: '#01B1DC',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [0, 1, 1.5, 2.4, 2.6, 3, 3.1, 3.5, 4, 4.5, 4.2, 3.8, 3.4, 3.8, 3.6, 3.5, 3.0, 2.9, 2.6, 2.5, 2.3, 1.5, 1.1, 0],
      },
    ],
  },
  //排水一张图   厂站监测历史数据
  floodOneMapDataByPumpCode: {
    grid: {
      top: '40px',
      left: '40px',
      right: '40px',
      bottom: '40px',
    },
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: [],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      axisLabel: {
        textStyle: {
          color: '#00D1FF',
        },
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      // prettier-ignore
      data: [],
    },
    yAxis: {
      name: '',
      type: 'value',
      textStyle: {
        color: '#00D1FF',
      },
      axisLine: {
        show: false,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      splitLine: {
        //x网格样式
        show: true,
        lineStyle: {
          color: '#00D1FF',
          type: 'dashed',
        },
      },
    },
    series: {
      name: '',
      type: 'line',
      symbol: 'none',

      lineStyle: {
        width: 1,
        color: '#eee73c',
      },
      emphasis: {
        focus: 'series',
      },
      // prettier-ignore
      data: [],
    },
  },
  //排水一张图   风险研判降雨预报
  floodOneMapFXrain: {
    color: pinias.$state.chartColor,
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    grid: {
      top: '40px',
      left: '10%',
      right: '40px',
      bottom: '30%',
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['实测雨量', '预报雨量'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: [
      {
        type: 'category',
        boundaryGap: true,
        axisLabel: {
          formatter: '{value} ',
          color: '#00D1FF',
          rotate: 45,
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        data: [
          '14:00',
          '14:10',
          '14:20',
          '14:30',
          '14:40',
          '14:50',
          '15:00',
          '15:10',
          '15:20',
          '15:30',
          '15:40',
          '15:50',
          '16:00',
        ],
      },
    ],
    yAxis: [
      {
        name: 'mm',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        splitNumber: 3,
        formatter: '{value} ',
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        splitLine: {
          //x网格样式
          show: true,
          lineStyle: {
            color: '#00D1FF',
            type: 'dashed',
          },
        },
      },
    ],
    series: [
      {
        name: '实测雨量',
        symbolSize: 5,
        data: [5.5, 5.1, 5.1, 5.7],
        type: 'bar',
        barWidth: 10,
        itemStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 0, color: 'rgba(1, 183, 226,1)' },
            { offset: 0.5, color: 'rgba(1, 183, 226,0.5)' },
            { offset: 1, color: 'rgba(1, 183, 226,0.2)' },
          ]),
        },
      },
      {
        name: '预报雨量',
        data: [, , , , 5.4, 5.2, 5.0, 5.5, 5.3, 5.1, 5.2, 5.3],
        type: 'bar',
        barWidth: 10,
        itemStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 0, color: 'rgba(1, 220, 154,1)' },
            { offset: 0.5, color: 'rgba(1, 220, 154,0.5)' },
            { offset: 1, color: 'rgba(1, 220, 154,0.2)' },
          ]),
        },
      },
    ],
  },
  //排水一张图   入河排口统计
  floodOneMapPSPK: {
    color: pinias.$state.chartColor,
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    grid: {
      top: '15%',
      left: '8%',
      right: '5%',
      bottom: '10%',
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['雨水排口', '合流制溢流排口'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: [
      {
        type: 'category',
        //boundaryGap: false,
        axisLabel: {
          formatter: '{value} ',
          color: '#00D1FF',
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        data: [],
      },
    ],
    yAxis: [
      {
        name: '个',
        type: 'value',
        textStyle: {
          color: '#00D1FF',
        },
        minInterval: 1,
        formatter: '{value} ',
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        splitLine: {
          //x网格样式
          show: true,
          lineStyle: {
            color: '#00D1FF',
            type: 'dashed',
          },
        },
      },
    ],
    series: [
      {
        name: '雨水排口',
        data: [],
        type: 'bar',
        barWidth: 20,
      },
      {
        name: '合流制溢流排口',
        data: [],
        type: 'bar',
        barWidth: 20,
      },
    ],
  },
  //弹窗 趋势分析折线图
  popupTrend: {
    grid: {
      top: '40px',
      left: '40px',
      right: '40px',
      bottom: '40px',
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['前池液位', '1#液位'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      axisLabel: {
        textStyle: {
          color: '#00D1FF',
        },
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      // prettier-ignore
      data: [
        ' 2:00', ' 3:00', ' 4:00', ' 5:00', ' 6:00', ' 7:00', ' 8:00', ' 9:00', ' 10:00', ' 11:00', ' 12:00', ' 13:00', ' 14:00', ' 15:00', ' 16:00', ' 17:00', ' 18:00', ' 19:00', ' 20:00', ' 21:00', ' 22:00', ' 23:00', '2009/6/13 0:00', ' 1:00'
      ],
    },
    yAxis: {
      name: '单位：m',
      type: 'value',
      textStyle: {
        color: '#00D1FF',
      },
      axisLine: {
        show: false,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      splitLine: {
        //x网格样式
        show: true,
        lineStyle: {
          color: '#00D1FF',
          type: 'dashed',
        },
      },
    },
    series: [
      {
        name: '前池液位',
        type: 'line',
        symbol: 'none',

        lineStyle: {
          width: 1,
          color: '#01B1DC',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          3.5, 3, 4.5, 5, 5.1, 5.3, 5.1, 5.5, 5.4, 5.5, 5.2, 5.8, 5.4, 5.8, 5.6, 5.5, 4, 3.9, 3.6, 3.5, 3.3, 3.5, 3.1, 3
        ],
      },
      {
        name: '1#液位',
        type: 'line',
        symbol: 'none',

        lineStyle: {
          width: 1,
          color: '#D9D237',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          2.5, 2, 3.5, 4, 4.1, 4.3, 4.1, 4.5, 4.4, 4.4, 4.2, 4.8, 4.4, 4.8, 4.6, 4.5, 3, 2.9, 2.6, 2.5, 2.3, 2.5, 2.1, 2
        ],
      },
    ],
  },
  //降雨量
  popupRainTrend: {
    color: pinias.$state.chartColor,
    grid: {
      top: '40px',
      left: '40px',
      right: '40px',
      bottom: '40px',
    },
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: [],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      axisLabel: {
        textStyle: {
          color: '#00D1FF',
        },
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      // prettier-ignore
      data: [],
    },
    yAxis: {
      name: '',
      type: 'value',
      textStyle: {
        color: '#00D1FF',
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      splitLine: {
        //x网格样式
        show: true,
        lineStyle: {
          color: '#00D1FF',
          type: 'dashed',
        },
      },
    },
    series: {
      name: '',
      type: 'bar',
      data: [],
    },
  },
  //弹窗 渍水点折线图
  popupTrendZS: {
    grid: {
      top: '40px',
      left: '40px',
      right: '40px',
      bottom: '25%',
    },
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['水位'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      axisLabel: {
        color: '#00D1FF',
        // rotate: 30,
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      // prettier-ignore
      data: [
        ' 2:00', ' 3:00', ' 4:00', ' 5:00', ' 6:00', ' 7:00', ' 8:00', ' 9:00', ' 10:00', ' 11:00', ' 12:00', ' 13:00', ' 14:00', ' 15:00', ' 16:00', ' 17:00', ' 18:00', ' 19:00', ' 20:00', ' 21:00', ' 22:00', ' 23:00', '2009/6/13 0:00', ' 1:00'
      ],
    },
    yAxis: {
      name: '单位：m',
      type: 'value',
      textStyle: {
        color: '#00D1FF',
      },
      axisLine: {
        show: false,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      splitLine: {
        //x网格样式
        show: true,
        lineStyle: {
          color: '#00D1FF',
          type: 'dashed',
        },
      },
    },
    series: [
      {
        name: '水位',
        type: 'line',
        symbol: 'none',

        lineStyle: {
          width: 1,
          color: '#01B1DC',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          0.1, 0.13, 0.134, 0.15, 0.17, 0.2, 0.33, 0.4, 0.45, 0.5, 0.437, 0.42, 0.38, 0.36, 0.35, 0.38, 0.41, 0.41, 0.43, 0.38, 0.28, 0.2, 0.15, 0.13
        ],
      },
    ],
  },
  //河道监测
  popupTrendRiver: {
    grid: {
      top: '40px',
      left: '40px',
      right: '40px',
      bottom: '40px',
    },
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['水位'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: {
      type: 'category',
      boundaryGap: false,
      axisLabel: {
        textStyle: {
          color: '#00D1FF',
        },
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      // prettier-ignore
      data: [],
    },
    yAxis: {
      name: 'm',
      type: 'value',
      textStyle: {
        color: '#00D1FF',
      },
      axisLine: {
        show: false,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      splitLine: {
        //x网格样式
        show: true,
        lineStyle: {
          color: '#00D1FF',
          type: 'dashed',
        },
      },
    },
    series: {
      name: '水位',
      type: 'line',
      symbol: 'none',
      lineStyle: {
        width: 2,
        color: '#D9D237',
      },
      emphasis: {
        focus: 'series',
      },
      // prettier-ignore
      data: [],
    },
  },
  // 排水一张图  风险研判沿程水位
  floodOneMapWaterLevel: {
    grid: {
      top: '40px',
      left: '40px',
      right: '70px',
      bottom: '40px',
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['警戒水位', '当前水位', '河底高程', '左岸', '右岸'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 14,
      },
    },
    xAxis: [
      {
        name: '单位：m',
        type: 'category',
        boundaryGap: false,
        axisLabel: {
          textStyle: {
            color: '#00D1FF',
          },
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },

        // prettier-ignore
        data: [
          0, 25, 50, 75, 100, 125, 150, 175, 200, 225, 250, 275, 300, 325, 350, 375, 400, 425, 450, 475, 500, 525, 550, 575, 600, 625, 650, 675, 700
        ],
      },
    ],
    yAxis: [
      {
        name: '单位：m',
        type: 'value',
        scale: true,
        textStyle: {
          color: '#00D1FF',
        },
        axisLine: {
          show: false,
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        splitLine: {
          //x网格样式
          show: true,
          lineStyle: {
            color: '#00D1FF',
            type: 'dashed',
          },
        },
      },
    ],
    series: [
      {
        name: '左岸',
        type: 'line',
        symbol: 'none',
        smooth: true,
        lineStyle: {
          width: 2,
          color: '#b9a5ff',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          18.2, 18.5, 18.7, 18.9, 19.1, 19.2, 19.3, 19.4, 19.5, 19.6, 19.7, 19.9, 20, 20.1, 20.1, 20.2, 20, 20, 19.8, 19.6, 19.5, 19.3, 19.2, 19.1, 18.9, 18.7, 18.5, 18.3, 18.2
        ],
      },
      {
        name: '右岸',
        type: 'line',
        symbol: 'none',
        smooth: true,
        lineStyle: {
          width: 2,
          color: '#90ffc4',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          18.3, 18.6, 18.7, 18.8, 18.9, 19.1, 19.2, 19.5, 19.4, 19.4, 19.5, 19.7, 19.9, 20, 20.1, 20.1, 19.9, 19.9, 19.8, 19.6, 19.5, 19.3, 19.2, 19.1, 18.9, 18.8, 18.6, 18.6, 18.3
        ],
      },
      {
        name: '当前水位',
        type: 'line',
        symbol: 'none',
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: 'rgba(21, 182, 228, 1)', // 0% 处的颜色
              },
              {
                offset: 1,
                color: 'rgba(21, 182, 228, 0.1)', // 100% 处的颜色
              },
            ],
            global: false, // 缺省为 false
          },
        },
        lineStyle: {
          width: 1,
          color: '#9ccdf7',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          16, 16, 16, 16, 16, 16, 16, 16.1, 16.1, 16.1, 16.1, 16.1, 16.1, 16.1, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16, 16
        ],
      },
      {
        name: '警戒水位',
        type: 'line',
        symbol: 'none',
        smooth: true,
        itemStyle: {
          normal: {
            lineStyle: {
              width: 2,
              color: '#ee6666',
              type: 'dashed',
            },
          },
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18, 18,
        ],
      },
      {
        name: '河底高程',
        type: 'line',
        symbol: 'none',
        areaStyle: {
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: 'rgba(215, 207, 143, 1)', // 0% 处的颜色
              },
              {
                offset: 1,
                color: 'rgba(215, 207, 143, 0.1)', // 100% 处的颜色
              },
            ],
            global: false, // 缺省为 false
          },
        },
        lineStyle: {
          width: 1,
          color: '#d7cf8f',
        },
        emphasis: {
          focus: 'series',
        },
        // prettier-ignore
        data: [
          15.6, 15.5, 14.7, 14.5, 14.1, 13.5, 13.3, 12.9, 12.5, 12.6, 12.7, 12.6, 12.6, 12.8, 13, 13.1, 13.3, 13.4, 13.6, 13.9, 14.2, 14.5, 14.5, 14.7, 14.8, 15, 15.1, 15.3, 15.5, 15.6],
      },
    ],
  },
  // 排水一张图  态势研判 河湖风险研判
  floodOneMapFXYP: {
    grid: {
      top: '40px',
      left: '40px',
      right: '5%',
      bottom: '10%',
    },
    // 显示暂无数据
    graphic: {
      type: 'text', // 类型：文本
      left: 'center',
      top: 'middle',
      silent: true, // 不响应事件
      invisible: false, // 有数据就隐藏
      style: {
        fill: '#c6c6c6',
        fontWeight: 'bold',
        text: '暂无数据',
        fontFamily: 'Microsoft YaHei',
        fontSize: '18px',
      },
    },
    tooltip: {
      trigger: 'axis',
      axisPointer: {
        type: 'cross',
        animation: false,
        label: {
          backgroundColor: '#505765',
        },
      },
    },
    legend: {
      data: ['当前水位', '河床'],
      textStyle: {
        color: '#00D1FF',
        fontsize: 13,
      },
    },
    xAxis: [
      {
        name: '',
        type: 'category',
        boundaryGap: false,
        axisLabel: {
          fontSize: 12,
          color: '#00D1FF',
        },
        axisLine: {
          show: true,
          symbol: ['none', 'arrow'],
          lineStyle: {
            color: '#00D1FF', //刻度线的颜色
          },
        },
        data: [],
      },
    ],
    yAxis: {
      name: '单位：m',
      type: 'value',
      scale: true,
      textStyle: {
        color: '#00D1FF',
      },
      axisLine: {
        show: false,
        lineStyle: {
          color: '#00D1FF', //刻度线的颜色
        },
      },
      splitLine: {
        //x网格样式
        show: false,
        lineStyle: {
          color: '#00D1FF',
          type: 'dashed',
        },
      },
    },
    series: [
      {
        name: '当前水位',
        type: 'line',
        symbol: 'none',
        smooth: true,
        lineStyle: {
          color: 'rgba(156, 205, 247, 0.5)',
        },
        // 填充区域的样式
        areaStyle: {
          // 填充色渐变
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 1, color: 'rgba(156, 205, 247, 0.3)' },
            { offset: 0, color: 'rgba(156, 205, 247, 1)' },
          ]),
        },
        data: [],
      },
      {
        name: '河床',
        type: 'line',
        symbol: 'none',
        smooth: true,
        lineStyle: {
          color: 'rgba(215, 207, 143, 0.5)',
        },
        // 填充区域的样式
        areaStyle: {
          // 填充色渐变
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
            { offset: 1, color: 'rgba(215, 207, 143, 0.3)' },
            { offset: 0, color: 'rgba(215, 207, 143, 1)' },
          ]),
        },
        data: [],
        // 设防水位线
        markLine: {
          silent: true,
          symbol: ['circle', 'arrow'], // none为标线两端的样式为无，可更改
          data: [
            {
              yAxis: 19, // 警戒线位置，这个赋值为纵轴50
              lineStyle: { type: 'dashed', color: 'red', width: 1 }, // 样式： 线型、颜色、线宽
              label: {
                show: true,
                position: 'middle', // 文字位置
                formatter: '设防水位 19m', //文字
                color: 'red', // 文字颜色
              },
            },
          ],
        },
      },
    ],
  },
};

export default chartOption;