pc_kingdee_large_screen/investmentPort/js/investHomeGroup.js

let app = new Vue({
  el: '#app',
  data () {
    return {
      boardType: '', // 哪边的项目看板
      pullShow: false, // 选择年份弹窗
      pollList: [2021, 2022, 2023, 2024],
      mockData: true,// 是否使用修改的数据
      year: 2023, // 选择的年份
      boardUrl: '', // 跳转路径
      boardTipShow: false, // 项目看板弹窗专用
      lineCommonCompany: [], //双柱状图弹窗上面的折线图x轴
      commonCompanyAll: [], // 公司包括编码
      changeLine: true,
      versions: true,
      app_token: '',
      centerShow: false, // 中间内容显示
      echartR4Chart: '',// 倒数第二个专用
      echartR5Chart: '', // 倒是第一个专用
      myChartTip1: '', // 弹窗单个柱状图专用
      myChartTip2: '', // 弹窗两个柱状图专用
      myChartTip3: '', // 弹窗两个柱状图专用
      echartEnterpriseShow: false, // 企业额度分析控制
      mapChart: '',//地图专用echarts
      chartCarousel: '',//做大屏轮播专用echarts
      mapTipShow: false,
      echartSingleTipShow: false,
      echartDoubleTipShow: false,
      projectListTipShow: false, //项目列表专属弹窗
      titleUrl: '',
      titleName: '',
      yellowCount: 0, // 黄圈轮播参数
      yellowPosition: 40,// 黄圈悬浮窗位置参数
      yellowType: true, // 黄圈悬浮停止轮播
      echartR1Fd: true,
      echartR2Fd: true,
      echartC2Fd: true,
      echartR3Fd: true,
      echarts1Time: 16000,
      time: '',
      timer: '',
      timer2: '',
      center1: center1,
      showTip2: false,
      showTip3: false,
      list: [],
      count: 0,
      countType: 0,
      geoCoordMap: {},
      storageRecordConfig2: center9,
      titleList: right1,
      centerLeftList: right3,
      storageRecordConfig: left11,
      config5: {
        rowNum: 9,
        waitTime: 2000,
        headerHeight: '40',
        header: ["项目名称", "所属组织", '实施主体', '建设性质（新建/续建）', '产业类别', '建设地点', '2022年投资完成额（万元）'],
        data: [
          ["青银二广高速公路太原联络线建设PPP项目", "交控集团", "山西路桥建设集团有限公司", "新建", "交通运输业", "山西省太原市、晋中市", "148,086.00"],
          ["国道241、省道岚马线汾河水库段改线工程", "交控集团", "太原国省道汾河水库段建设管理有限公司", "续建", "交通运输业", "山西省 太原市、吕梁市", "165,314.33"],
          ["路桥科技中心", "交控集团", "山西路桥集团多经营有限公司", "续建", "建筑房地产", "山西省太原市", "8,098.26"],
          ["路桥科研基地", "交控集团", "山西路桥集团多经有限公司", "续建", "建筑房地产", "山西省太原市", "6,596.56"],
          ["武宿高速充电站建设", "交控集团", "山西交通运输投融资集团有限责任公司", "新建", "新能源", "山西省太原市", "100.00"],
          ["山西交通研创商务基地项目", "交控集团", "山西交通物流集团有限公司", "续建", "建筑房地产", "山西省太原市", "4,097.00"],
          ["山西省交通科学研究院产业化基地", "交控集团", "山西省交通科技研发有限公司", "续建", "建筑房地产", "山西省太原市武洛街27号", "3,242.00"],
          ["太长高速公路太原南收费站（二期工程暨龙城服务区）项目", "交控集团", "山西省交通开发投资集团有限公司龙城服务区发展分公司", "续建", "建筑房地产", "山西省太原市", "3,580.00"],
          ["山西转型综改示范区中小企业产业园项目", "交控集团", "山西交投综改园区开发有限公司", "续建", "建筑房地产", "山西省太原市", "14,432.00"]
        ],
        align: ["center", "center", "center", "center", "center", "center", "center"],
        headerBGC: "#153A62",
        oddRowBGC: "#061F42",
        evenRowBGC: "#0C284A",
      },
      originalConfig6: [],
      config6: listPop
    }
  },
  created () {
    this.time = formatDate()
    this.timer = setInterval(() => {
      this.time = formatDate()
    }, 1000)
    this.timer2 = setInterval(() => {
      this.yellowType && this.changeYellow()
    }, 2000)
  },
  beforeDestroy () {
    if (this.timer) {
      clearInterval(this.timer);
    }
    if (this.timer2) {
      clearInterval(this.timer2);
    }
  },
  mounted () {
    this.comeIn()
  },
  methods: {
    comeIn () {
      if (this.versions) {
        // 接口版
        this.getAppToken()
        setTimeout(() => {
          this.changeTopColor()
          // 大屏三
          this.initChartR5()
          this.changeYellow()
        })
      } else {
        // 假数据版
        setTimeout(() => {
          this.initChartL1()
          this.initChartL2()
          this.initChartL3()
          this.initChartL4()
          this.initChartL5()
          this.initChartL6()
          this.initChartL7()
          this.initChartL8()
          this.initChartL10()
          this.initChartL11()
          this.changeTopColor()
          // 大屏二
          this.initChinaChart()
          // 大屏三
          this.initChartR1()
          this.initChartR2()
          this.initChartR3()
          this.changeYellow()
        })
      }
    },
    chooseTime (value) {
      let that = this
      this.year = value
      that.destroyCharts()
      this.pullShow = false
      setTimeout(item => {
        that.comeIn()
      })
    },
    destroyCharts () {
      this.left10Chart ? this.left10Chart.dispose() : ''
      this.left1Chart ? this.left1Chart.destroy() : ''
      this.left2Chart ? this.left2Chart.destroy() : ''
      this.left3Chart ? this.left3Chart.destroy() : ''
      this.left4Chart ? this.left4Chart.destroy() : ''
      this.left5Chart ? this.left5Chart.destroy() : ''
      this.left6Chart ? this.left6Chart.destroy() : ''
      this.left7Chart ? this.left7Chart.dispose() : ''
      this.left8Chart ? this.left8Chart.dispose() : ''
      this.left9Chart ? this.left9Chart.dispose() : ''
      this.chartCarousel ? this.chartCarousel.dispose() : ''
      this.myChartTip1 ? this.myChartTip1.dispose() : ''
      this.myChartTip2 ? this.myChartTip2.dispose() : ''
      this.myChartTip3 ? this.myChartTip3.dispose() : ''
      this.left11Chart ? this.left11Chart.dispose() : ''
      this.right1Chart ? this.right1Chart.dispose() : ''
      this.right2Chart ? this.right2Chart.dispose() : ''
      this.right3Chart ? this.right3Chart.dispose() : ''
      this.echartR4Chart ? this.echartR4Chart.dispose() : ''
      this.echartR5Chart ? this.echartR5Chart.dispose() : ''
      this.center1Chart ? this.center1Chart.destroy() : ''
      this.center2Chart ? this.center2Chart.dispose() : ''
      this.center3Chart ? this.center3Chart.dispose() : ''
      this.center4Chart ? this.center4Chart.destroy() : ''
      this.mapChart ? this.mapChart.dispose() : ''
    },
    // 获取token
    getAppToken () {
      // dev环境
      // let value = {
      //   "appId": "xilan1014",              //系统编码
      //   "appSecret": "12345678910Aa@Bb@Cc",     //AccessToken加密认证密钥
      //   "tenantid": "",              //租户id
      //   "accountId": "",     //数据中心id
      //   "language": "zh_CN"
      // }
      // SIT环境
      let value = {
        "appId": "68dp",
        "appSecret": "9ErhY^O{n?@Pc#eb7HYX",
        "tenantid": "",
        "accountId": "1635498801198269440",
        "language": "zh_CN"
      }
      post('/ierp/api/getAppToken.do', value).then(res => {
        this.app_token = res.data.app_token
        this.getAccessToken()
      })
    },
    // 获取AccessToken
    getAccessToken () {
      let value = {
        "user": "19900000001",                //登录用户手机号
        "apptoken": this.app_token,  //应用令牌
        "tenantid": "",                    //租户id
        "accountId": "1635498801198269440",//数据中心id
        "usertype": "Mobile"
      }
      post('/ierp/api/login.do', value).then(res => {
        this.access_token = res.data.access_token
        this.getOrg()
      })
    },
    // 获取组织架构列表
    getOrg () {
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
        }
        get('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getOrgName', value).then(res => {
          this.commonCompanyAll = res.data
          commonCompany = res.data.map(item => item.simplename)
          // 左边
          this.getDate1()
          this.getDate2()
          this.getDate3()
          this.getDate4()
          this.getDate5()
          this.getDate6()

          // 右边
          // this.getDate7()
          // this.getDate8()
          // this.getDate9()
          // this.getDate10()
          // // this.getDate11() // 右下A
          // this.getDate12()  // 右下B

          // 中间
          this.getDate14()
          resolve(1);
        })
      });
    },
    // 获取左边企业额度分析
    getDate1 () {
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "data": {
            "mdnb_combofield": this.mockData ? 'B' : 'A',
            "mdnb_datefield": "2023-01-01",
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/tqqyedfx', value).then(res => {
          let dataList = res.data.rows[0].entryentity
          left3[0] = []
          dataList.forEach(item => {
            left3[0].push(item.mdnb_amountfield25)
          })
          this.initChartL4(dataList)
          resolve(1);
        })
      });
    },
    // 获取左边投资计划分析
    getDate2 () {
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "data": {
            "mdnb_combofield": this.mockData ? 'B' : 'A',
            "mdnb_datefield": "2023-01-01",
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/tqtzjhfx', value).then(res => {
          let dataList = res.data.rows[0]
          left4 = []
          left4[0] = dataList.mdnb_amountfield7
          left4[1] = dataList.mdnb_amountfield13
          left4[2] = dataList.mdnb_amountfield23
          left4[3] = dataList.mdnb_amountfield43
          left4[4] = dataList.mdnb_integerfield14
          left5[0].y = dataList.mdnb_amountfield9
          left5[0].num = dataList.mdnb_integerfield15
          left5[1].y = dataList.mdnb_amountfield43
          left5[1].num = dataList.mdnb_integerfield14
          left6[0].y = dataList.mdnb_amountfield15
          left6[0].num = dataList.mdnb_integerfield16
          left6[1].y = dataList.mdnb_amountfield16
          left6[1].num = dataList.mdnb_integerfield17
          that.initChartL2()
          that.initChartL3()
          resolve(1);
        })
      });
    },
    // 获取左边产业布局分析
    getDate3 () {
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "data": {
            "mdnb_combofield": this.mockData ? 'B' : 'A',
            "mdnb_datefield": "2023-01-01",
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/tqcebjfx', value).then(res => {
          let dataList = this.classify(res.data.rows[0].mdnb_entryentity, 'mdnb_textfield1')
          // 传统产业分析
          for (let i = 0; i < left7.length; i++) {
            left7[i].num = dataList[0].data[i].mdnb_integerfield13
            left7[i].y = dataList[0].data[i].mdnb_amountfield8
          }
          this.initChartL5()
          // 战略性新兴产业
          // for(let i = 0;i<left8.length;i++){
          //   left8[i].num = dataList[1].data[i].mdnb_integerfield13
          //   left8[i].y = dataList[1].data[i].mdnb_amountfield8
          // }
          // this.initChartL6()
          // 特色优势产业
          // for(let i = 0;i<left9.length;i++){
          //   left9[i].num = dataList[2].data[i].mdnb_integerfield13
          //   left9[i].y = dataList[2].data[i].mdnb_amountfield8
          // }
          // this.initChartL7()
          // 公共基础等产业
          for (let i = 0; i < left10.length; i++) {
            left10[i].num = dataList[3].data[i].mdnb_integerfield13
            left10[i].y = dataList[3].data[i].mdnb_amountfield8
          }
          this.initChartL8()
          resolve(1);
        })
      });
    },
    // 获取左边项目阶段分析
    getDate4 () {
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "data": {
            "mdnb_combofield": this.mockData ? 'B' : 'A',
            "mdnb_datefield": "2023-01-01",
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/tqxmjdfx', value).then(res => {
          let dataList = res.data.rows[0]
          // 固定资产进度分布
          // 特别监管
          left13[0][0][2] = dataList.mdnb_integerfield1
          left13[0][0][3] = dataList.mdnb_amountfield241
          left13[0][1][2] = dataList.mdnb_integerfield3
          left13[0][1][3] = dataList.mdnb_amountfield5
          left13[0][2][2] = dataList.mdnb_integerfield5
          left13[0][2][3] = dataList.mdnb_amountfield21
          left13[0][3][2] = dataList.mdnb_integerfield7
          left13[0][3][3] = dataList.mdnb_amountfield29
          // 备案
          left13[1][0][2] = dataList.mdnb_integerfield2
          left13[1][0][3] = dataList.mdnb_amountfield341
          left13[1][1][2] = dataList.mdnb_integerfield4
          left13[1][1][3] = dataList.mdnb_amountfield11
          left13[1][2][2] = dataList.mdnb_integerfield6
          left13[1][2][3] = dataList.mdnb_amountfield28
          left13[1][3][2] = dataList.mdnb_integerfield8
          left13[1][3][3] = dataList.mdnb_amountfield30
          // 股权类进度分布
          // 特别监管
          left14[0][0][2] = dataList.mdnb_integerfield11
          left14[0][0][3] = dataList.mdnb_amountfield2411
          left14[0][1][2] = dataList.mdnb_integerfield31
          left14[0][1][3] = dataList.mdnb_amountfield51
          left14[0][2][2] = dataList.mdnb_integerfield51
          left14[0][2][3] = dataList.mdnb_amountfield211
          left14[0][3][2] = dataList.mdnb_integerfield71
          left14[0][3][3] = dataList.mdnb_amountfield291
          // 备案
          left14[1][0][2] = dataList.mdnb_integerfield21
          left14[1][0][3] = dataList.mdnb_amountfield3411
          left14[1][1][2] = dataList.mdnb_integerfield41
          left14[1][1][3] = dataList.mdnb_amountfield111
          left14[1][2][2] = dataList.mdnb_integerfield61
          left14[1][2][3] = dataList.mdnb_amountfield281
          left14[1][3][2] = dataList.mdnb_integerfield81
          left14[1][3][3] = dataList.mdnb_amountfield301
          this.initChartL10()
          this.initChartL11()
          resolve(1);
        })
      });
    },
    // 获取左边投资额度分析
    getDate5 () {
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "data": {
            "mdnb_combofield": this.mockData ? 'B' : 'A',
            "mdnb_datefield": "2023-01-01",
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/tqtzedfx', value).then(res => {
          let dataList = res.data.rows[0]
          left1[0] = dataList.mdnb_amountfield
          left1[1] = dataList.mdnb_amountfield1
          left1[2] = dataList.mdnb_amountfield2
          left2[0] = dataList.mdnb_decimalfield
          left2[1] = dataList.mdnb_amountfield3
          this.initChartL1()
          resolve(1);
        })
      });
    },
    // 获取左边重点项目两线指标
    getDate6 () {
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "data": {
            "mdnb_combofield": this.mockData ? 'B' : 'A',
            "mdnb_datefield": "2023-01-01",
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/tqzdlxzb', value).then(res => {
          let dataList2 = this.classify(res.data.rows[0].mdnb_entryentity1, 'mdnb_textfield3')
          console.log(dataList2,'??????????')
          left12 = []
          dataList2.forEach((item, index) => {
            left12[index] = [[], [], []]
            for (let i = 0; i < 5; i++) {
              left12[index][0] = item.data[i].mdnb_integerfield10
              left12[index][1] = item.data[i].mdnb_integerfield12
              left12[index][2] = item.data[i].mdnb_integerfield9
            }
          })
          let dataList = []
          dataList2.forEach((item, index) => {
            dataList[index] = []
            dataList[index][0] = item.data[0].mdnb_textfield18
            dataList[index][1] = item.data[0].mdnb_textfield3
            dataList[index][2] = item.data[0].mdnb_amountfield24
          })
          this.storageRecordConfig.data = dataList
          this.storageRecordConfig = { ...this.storageRecordConfig }
          // center8 = dataList
          resolve(1);
        })
      });
    },
    // 获取右边顶部条数据
    getDate7 () {
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "request": {
            isInsert: this.mockData ? '1' : '0',
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getTabpageap', value).then(res => {
          right1[0].number = res.data.mdnb_one_step
          right1[2].number = res.data.mdnb_two_step
          right1[4].number = res.data.mdnb_three_step
          right1[6].number = res.data.mdnb_four_step
          right1[8].number = res.data.mdnb_five_step
          right1[10].number = res.data.mdnb_six_step
          right1[12].number = res.data.mdnb_seven_step
          right1[14].number = res.data.mdnb_eight_step
          resolve(1);
        })
      });
    },
    // 获取右边中间左边的（正偏差/容差内/负偏差）
    getDate8 () {
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "request": {
            isInsert: this.mockData ? '1' : '0',
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getInvestSunstraction', value).then(res => {
          right3[0].value = res.data.mdnb_projectnum_z
          right3[0].value2 = res.data.mdnb_amountall_z
          right3[1].value = res.data.mdnb_projectnum_r
          right3[1].value2 = res.data.mdnb_amountall_r
          right3[2].value = res.data.mdnb_projectnum_f
          right3[2].value2 = res.data.mdnb_amountall_f
          resolve(1);
        })
      });
    },
    // 获取右边中间右边的（预算额/已签合同额。。。）
    getDate9 () {
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "request": {
            isInsert: this.mockData ? '1' : '0',
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getUnitBudgetExecuteDate', value).then(res => {
          res.data.forEach((item, index) => {
            right4[index].value = this.yuanChange(item.mdnb_aheadmoney)
            right4[index].value2 = this.yuanChange(item.mdnb_edmoney)
            right4[index].value3 = this.yuanChange(item.mdnb_smoney)
            right4[index].value4 = this.yuanChange(item.mdnb_jmoney)
            right4[index].value5 = this.yuanChange(item.mdnb_fkmoney)
          })
          this.initChartR1()
          resolve(1);
        })
      });
    },
    // 进度成本偏差
    getDate10 () {
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "request": {
            isInsert: this.mockData ? '1' : '0',
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getInvestSunstractionGas', value).then(res => {
          res.data.forEach((item, index) => {
            right5[0][index][1] = item.mdnb_amount_zb
            right5[0][index][2] = item.mdnb_amount_z
            right5[1][index][1] = item.mdnb_amount_nb
            right5[1][index][2] = item.mdnb_amount_n
            right5[2][index][1] = item.mdnb_amount_fb
            right5[2][index][2] = item.mdnb_amount_f
          })
          this.initChartR2()
          resolve(1);
        })
      });
    },
    // 项目风险分析A
    getDate11 () {
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "request": {
            isInsert: this.mockData ? '1' : '0',
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getUnitNoSolveDangerDate', value).then(res => {
          res.data.forEach((item, index) => {
            right6[index].value = item.mdnb_height
            right6[index].value2 = item.mdnb_midle
            right6[index].value3 = item.mdnb_bottom
          })
          this.initChartR3()
          resolve(1);
        })
      });
    },
    // 项目风险分析B(雷达图)
    getDate12 () {
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "request": {
            isInsert: this.mockData ? '1' : '0',
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getUnitDangerPoraitDate', value).then(res => {
          res.data.forEach((item, index) => {
            right7[index][0] = item.mdnb_anquan
            right7[index][1] = item.mdnb_fukuan
            right7[index][2] = item.mdnb_hetong
            right7[index][3] = item.mdnb_jiesuan
            right7[index][4] = item.mdnb_jindu
            right7[index][5] = item.mdnb_securty
          })
          this.getDate11()
          resolve(1);
        })
      });
    },
    // 中间大屏数据
    getDate14 () {
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          mock: true,
          presetYear: 2023
        }
        get('/ierp/kapi/v2/mdnb/mdnb_xmkb/presetdata/getKeyData', value).then(res => {
          // 头部指标
          center4[0] = res.data.transformations.estateAmount
          center4[1] = res.data.transformations.estateNum
          center4[2] = res.data.transformations.figureAmount
          center4[3] = res.data.transformations.figureNum
          // 左投部指标
          center1[0] = res.data.keyIndicators.totalSum
          center1[1] = res.data.keyIndicators.total
          center1[2] = res.data.keyIndicators.property
          center1[3] = res.data.keyIndicators.invest
          // 投资产业分布
          for (let i = 0; i < center2.length; i++) {
            center2[i].y = res.data.distribution[i].amount
            center2[i].num = res.data.distribution[i].count
            center2[i].typeno = res.data.distribution[i].typeno
          }
          // 投资执行情况
          res.data.implementationStatus.forEach((item, index) => {
            center3[index].value = that.yuanChange(item.plan)
            center3[index].value2 = that.yuanChange(item.reality)
          })
          // 五个一体化
          res.data.five.forEach((item, index) => {
            center6[index] = { name: item.type, value: that.yuanChange(item.amount), typeno: item.typeno }
          })
          // 投资阶段分析
          res.data.investmentStage.forEach((item, index) => {
            center7[index] = { name: item.type, value: Number(item.num), value2: Number(item.amount), typeno: item.typeno, sliced: false, selected: false }
          })
          // 重点项目监控
          center8 = []
          this.originalConfig6 = res.data.projectMonitoring
          res.data.projectMonitoring.forEach((item, index) => {
            center8.push({ value: item.amount, name: item.name, office: item.group })
          })
          // 中国地图
          centerChina = []
          res.data.investmentMap.forEach((item, index) => {
            centerChina.push({ name: item.address, value: item.amount, value2: item.value2 })
          })
          // 项目状态
          proState.projectStatus1 = res.data.projectStatus.projectStatus1
          proState.projectStatus2 = res.data.projectStatus.projectStatus2
          proState.projectStatus3 = res.data.projectStatus.projectStatus3
          setTimeout(() => {
            that.initChinaChart()
          })
          resolve(1);
        })
      });
    },
    // 右边穿透一级
    rightPenetrateOne () {
      this.boardType = 'right'
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "request": {
            isInsert: this.mockData ? '1' : '0'
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getOneLevelData', value).then(res => {
          res.data.forEach((item, index) => {
            common4[index] = item.mdnb_projects
            common5[index] = item.mdnb_amount_sl
          })
          setTimeout(() => {
            this.initChartLTip2('right')
            this.initChartLTip3('right')
          })
          resolve(1);
        })
      });
    },
    // 右边穿透二级
    rightPenetrateTwo (modelName, substraction, orgName) {
      this.boardType = 'right'
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "request": {
            isInsert: this.mockData ? '1' : '0',
            modelName,
            substraction,
            orgName
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_middle/getTwoLevelData', value).then(res => {
          that.config6.data = []
          that.originalConfig6 = res.data
          res.data.forEach((item, index) => {
            that.config6.data[index] = []
            that.config6.data[index][0] = item.mdnb_project_name
            that.config6.data[index][1] = item.mdnb_org
            that.config6.data[index][2] = item.mdnb_implement_org
            that.config6.data[index][3] = item.mdnb_insdrutytype1
            that.config6.data[index][4] = item.mdnb_insdrutytype2
            that.config6.data[index][5] = item.mdnb_investment_money
          })
          that.config6 = { ...that.config6 }
          that.projectListTipShow = true
          resolve(1);
        })
      });
    },
    // 左边穿透一级
    leftPenetrateOne (mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, typeNum, type, param, typeCTwo, paramCTwo) {
      this.boardType = 'left'
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          "data": {
            mdnb_combofield: this.mockData ? 'B' : 'A',
            mdnb_textfield11,
            mdnb_textfield13,
            mdnb_textfield16,
            mdnb_textfield23,
            mdnb_datefield: this.year + '-01-01'
          },
          pageSize: 1000
        }
        post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/yjct', value).then(res => {
          if (typeNum == 2) {
            common4 = []
            common5 = []
            res.data.rows[0].mdnb_entryentity12.forEach((item, index) => {
              common4.push(item.mdnb_integerfield18)
              common5.push(item.mdnb_amountfield12)
            })
            setTimeout(() => {
              this.initChartLTip2('left', mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, type, param, typeCTwo, paramCTwo)
              this.initChartLTip3('left', mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, type, param, typeCTwo, paramCTwo)
            })
          } else if (typeNum == 1) {
            this.initChartLTip('left', mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, type, param, typeCTwo, paramCTwo)
          }
          resolve(1);
        })
      });
    },
    // 左边穿透二级
    leftPenetrateTwo (mdnb_textfield12, mdnb_textfield19, mdnb_textfield15, mdnb_textfield17, mdnb_textfield20) {
      this.boardType = 'left'
      let that = this
      console.log(mdnb_textfield12, mdnb_textfield19, mdnb_textfield15, mdnb_textfield17, mdnb_textfield20)
      if (that.versions) {
        return new Promise((resolve, err) => {
          let value = {
            access_token: this.access_token,
            "data": {
              mdnb_combofield: this.mockData ? 'B' : 'A',
              mdnb_datefield: this.year + '-01-01',
              mdnb_textfield12,
              mdnb_textfield19,
              mdnb_textfield15,
              mdnb_textfield17,
              mdnb_textfield20
            },
            pageSize: 1000
          }
          if (mdnb_textfield20) {
            post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/ejct', value).then(res => {
              that.originalConfig6 = res.data.rows[0].mdnb_entryentity11
              that.config6.data = []
              res.data.rows[0].mdnb_entryentity11.forEach((item, index) => {
                that.config6.data[index] = []
                that.config6.data[index][0] = item.mdnb_textfield6
                that.config6.data[index][1] = item.mdnb_textfield7
                that.config6.data[index][2] = item.mdnb_textfield8
                that.config6.data[index][3] = item.mdnb_textfield9
                that.config6.data[index][4] = item.mdnb_textfield10
                that.config6.data[index][5] = item.mdnb_amountfield22
              })
              that.config6 = { ...that.config6 }
              that.projectListTipShow = true
              resolve(1);
            })
          } else {
            post('/ierp/kapi/v2/mdnb/mdnb_xmkb/mdnb_manager_preinvest/tzedfxzed', value).then(res => {
              that.originalConfig6 = res.data.rows[0].mdnb_entryentity11
              that.config6.data = []
              res.data.rows[0].mdnb_entryentity11.forEach((item, index) => {
                that.config6.data[index] = []
                that.config6.data[index][0] = item.mdnb_textfield6
                that.config6.data[index][1] = item.mdnb_textfield7
                that.config6.data[index][2] = item.mdnb_textfield8
                that.config6.data[index][3] = item.mdnb_textfield9
                that.config6.data[index][4] = item.mdnb_textfield10
                that.config6.data[index][5] = item.mdnb_amountfield22
              })
              that.config6 = { ...that.config6 }
              that.projectListTipShow = true
              resolve(1);
            })
          }
        });
      } else {
        that.projectListTipShow = true
      }
    },
    // 中间穿透一级                 一个柱状图还是两个
    centerPenetrateOne (type, param, typeNum, typeCTwo, paramCTwo, portType) {
      this.boardType = 'center'
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          mock: this.mockData,
          presetYear: this.year,
          type,
          param
        }
        get('/ierp/kapi/v2/mdnb/mdnb_xmkb/presetdata/getPenetrationLevel1', value).then(res => {
          if (typeNum == 1) {
            common3 = []
            res.data.keyIndicators.forEach((item, index) => {
              if (param == 'cyplanamount') {
                common3.push(item.cyplanamount)
              }
              if (param == 'cyplancount') {
                common3.push(item.cyplanamount)
              }
              if (param == 'szplanamount') {
                common3.push(item.cyplanamount)
              }
              if (param == 'szplancount') {
                common3.push(item.szplancount)
              }
              if (param == 'investamount') {
                common3.push(item.investamount)
              }
              if (param == 'projectcount') {
                common3.push(item.projectcount)
              }
              if (param == 'gdzcamount') {
                common3.push(item.projectcount)
              }
              if (param == 'gqtzamount') {
                common3.push(item.projectcount)
              }
              if (param == 'ceiamount') {
                common3.push(item.ceiamount)
              }
              if (param == 'cpneiamount') {
                common3.push(item.cpneiamount)
              }
              if (param == 'ccheiamount') {
                common3.push(item.ccheiamount)
              }
              if (param == 'cdiamount') {
                common3.push(item.cdiamount)
              }
              if (param == 'cciamount') {
                common3.push(item.cciamount)
              }
            })
            setTimeout(() => {
              this.initChartLTip('center', '', '', '', '', typeCTwo, paramCTwo, portType)
            })
          } else if (typeNum == 2) {
            common4 = []
            common5 = []
            if (type == 'distribution') {
              that.changeLine = false
              that.lineCommonCompany = res.data.topData.map(item => item.type)
              common4 = res.data.topData.map(item => item.amount)
              common5 = res.data.bottomData.map(item => item.amount)
            } else {
              if (param == 'new') {
                res.data.keyIndicators.forEach((item, index) => {
                  common4.push(item.newamount)
                  common5.push(item.newcount)
                })
              } else if (param == 'renew') {
                res.data.keyIndicators.forEach((item, index) => {
                  common4.push(item.renewamount)
                  common5.push(item.renewcount)
                })
              } else if (param == '太原市') {
                res.data.investmentMap.forEach((item, index) => {
                  common4.push(item.value2)
                  common5.push(item.amount)
                })
              }
            }
            setTimeout(() => {
              this.initChartLTip2('center', '', '', '', '', type, param, typeCTwo, paramCTwo, portType)
              this.initChartLTip3('center', '', '', '', '', type, param, typeCTwo, paramCTwo, portType)
            })
          } else if (typeNum == 3) {
            // 山西地图
            center5 = []
            res.data.investmentMap.forEach((item, index) => {
              center5.push({ name: item.address, value: item.amount, value2: item.value2 })
            })
            setTimeout(() => {
              that.initProvinceChart()
            });
          }
          resolve(1);
        })
      });
    },
    // 中间穿透二级
    centerPenetrateTwo (type, param, orgNum, portType) {
      console.log(type, param, orgNum, portType, '?????????+++++')
      this.boardType = 'center'
      let that = this
      return new Promise((resolve, err) => {
        let value = {
          access_token: this.access_token,
          mock: this.mockData,
          presetYear: this.year,
          type,
          param,
          orgNum
        }
        if (portType == 1) {
          get('/ierp/kapi/v2/mdnb/mdnb_xmkb/presetdata/MainPageMonthReportProject', value).then(res => {
            that.config6.data = []
            that.originalConfig6 = res.data
            res.data.forEach((item, index) => {
              that.config6.data[index] = []
              that.config6.data[index][0] = item.projectname
              that.config6.data[index][2] = item.orgName
              that.config6.data[index][5] = item.amount
            })
            that.config6 = { ...that.config6 }
            that.projectListTipShow = true
            resolve(1);
          })
        } else if (portType == 2) {
          get('/ierp/kapi/v2/mdnb/mdnb_xmkb/presetdata/MainPagePlanProject', value).then(res => {
            that.config6.data = []
            that.originalConfig6 = res.data
            res.data.forEach((item, index) => {
              that.config6.data[index] = []
              that.config6.data[index][0] = item.projectname
              that.config6.data[index][2] = item.orgName
              that.config6.data[index][5] = item.amount
            })
            that.config6 = { ...that.config6 }
            that.projectListTipShow = true
            resolve(1);
          })
        } else {
          value = {
            access_token: this.access_token,
            mock: this.mockData,
            presetYear: this.year,
            type: 'investmentMap',
            param: '太原市',
            orgNum
          }
          get('/ierp/kapi/v2/mdnb/mdnb_xmkb/presetdata/MainPageMonthReportProject', value).then(res => {
            that.config6.data = []
            that.originalConfig6 = res.data
            res.data.forEach((item, index) => {
              that.config6.data[index] = []
              that.config6.data[index][0] = item.projectname
              that.config6.data[index][2] = item.orgName
              that.config6.data[index][5] = item.amount
            })
            that.config6 = { ...that.config6 }
            that.projectListTipShow = true
            resolve(1);
          })
        }
      });
    },
    yellowMouse (index) {
      if (index % 2 == 0) {
        this.yellowCount = index
        this.yellowPosition = (index / 2 - 1) * 315 + 40
        this.yellowType = false
        this.changeYellow()
      }
    },
    // 回到中国地图
    backChina () {
      this.centerShow = false
      this.mapChart.dispose()
      setTimeout(() => {
        this.initChinaChart()
      });
    },
    // 找公司编码
    findCode (code) {
      let a = this.commonCompanyAll.find((item, index) => {
        return item.simplename == code
      })
      return a ? a.number.slice(0, 4) : ''
    },
    // 找项目编码
    findProjectCode (a, b, type) {
      console.log(a, b, type, '????????', this.originalConfig6)
      if (type == 'center') {
        let c = this.originalConfig6.find(item => {
          return item.name == b && item.group == a
        })
        return c.typeno
      } else if (type == 'right') {
        let c = this.originalConfig6.find(item => {
          return item.mdnb_project_name == a && item.mdnb_org == b
        })
        return c.mdnb_projectnumber
      } else if (type == 'left') {
        let c = this.originalConfig6.find(item => {
          return item.mdnb_textfield6 == a && item.mdnb_textfield8 == b
        })
        return c.mdnb_textfield14
      }
    },
    // 去项目看板
    goLookBoard (e, f) {
      if (f) {
        this.boardType = f
        this.boardUrl = `http://172.21.3.68:8081/ierp/accessTokenLogin.do?access_token=${this.access_token}&redirect=http://172.21.3.68:8081/ierp/index.html?formId=mdnb_threetoproject&prj=${this.findProjectCode(e.row[0], e.row[1], this.boardType)}`
      } else {
        this.boardUrl = `http://172.21.3.68:8081/ierp/accessTokenLogin.do?access_token=${this.access_token}&redirect=http://172.21.3.68:8081/ierp/index.html?formId=mdnb_threetoproject&prj=${this.findProjectCode(e.row[0], e.row[2], this.boardType)}`
      }
      // this.findProjectCode(e.row[0],e.row[2])
      // 当前页面打开
      // window.location.href = `http://192.168.2.111:8080/ierp/accessTokenLogin.do?access_token=${this.access_token}&redirect=http://192.168.2.111:8080/ierp/index.html?formId=mdnb_threetoproject&prj=PL_ZZGY_0_2023_000036`
      // 新页面打开
      // window.open('http://192.168.2.111:8080/ierp/accessTokenLogin.do?access_token=${this.access_token}&redirect=http://192.168.2.111:8080/ierp/index.html?formId=mdnb_threetoproject&prj=PL_ZZGY_0_2023_000036')
      this.boardTipShow = true
      console.log(this.boardUrl, '跳转去的项目看板地址')
    },
    // 根据key分组
    classify (arr, k) {
      let map = {};
      let myArr = [];
      for (let i = 0; i < arr.length; i++) {
        if (!map[arr[i][k]]) {
          let a = {}
          a[k] = arr[i][k]
          a.data = [arr[i]]
          myArr.push(a)
          map[arr[i][k]] = arr[i]
        } else {
          for (let j = 0; j < myArr.length; j++) {
            if (arr[i][k] === myArr[j][k]) {
              myArr[j].data.push(arr[i]);
              break
            }
          }
        }
      }
      return myArr
    },
    // 两个柱状图的弹窗
    showChartLTipDouble (e, location, mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, type, param, typeCTwo, paramCTwo, portType) {
      this.titleName = e
      this.closeTap()
      this.echartDoubleTipShow = true
      if (this.versions) {
        if (location == 'right') {
          this.rightPenetrateOne()
        }
        if (location == 'left') {
          this.leftPenetrateOne(mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, 2)
        }
        if (location == 'center') {
          this.centerPenetrateOne(type, param, 2, typeCTwo, paramCTwo, portType)
        }
      } else {
        setTimeout(() => {
          this.initChartLTip2()
          this.initChartLTip3()
        })
      }
    },
    // 单个柱状图的弹窗
    showChartLTipSingle (e, location, type, param, mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, typeCTwo, paramCTwo, portType) {
      this.closeTap()
      this.titleName = e
      this.echartSingleTipShow = true
      if (this.versions) {
        if (location == 'center') {
          this.centerPenetrateOne(type, param, 1, typeCTwo, paramCTwo, portType)
        }
        if (location == 'left') {
          this.leftPenetrateOne(mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, 1, type, param)
        }
      } else {
        setTimeout(() => {
          this.initChartLTip(location)
        })
      }
    },
    initChartLTip (location, mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, typeCTwo, paramCTwo, portType) {
      this.myChartTip1 = echarts.init(document.getElementById("echartSingleTip"));
      let option = {
        grid: {
          top: 40,
          right: 0,
          left: 60,
          bottom: 70,
        },
        tooltip: {
          show: true,
          trigger: "axis",
          axisPointer: {
            // 坐标轴指示器，坐标轴触发有效
            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: commonCompany,
          axisTick: {
            show: false,
          },
          // x轴的字体颜色
          axisLabel: {
            rotate: 40,
            textStyle: {
              color: "white",
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
          //y轴线的颜色以及宽度
          axisLine: {
            show: true,
            lineStyle: {
              color: "#1E5389",
              width: 1,
              type: "solid",
            },
          },
        },
        yAxis: {
          name: '亿',
          nameTextStyle: {//y轴上方单位的颜色
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          axisTick: {
            lineStyle: {
              color: "#18416F",
            },
          },
          // y轴的字体颜色
          axisLabel: {
            textStyle: {
              color: "white",
              fontSize: '20'
            },
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: '#68b4dd66',
              type: 'dashed',
            },
          },
          //y轴线的颜色以及宽度
          axisLine: {
            show: true,
            lineStyle: {
              color: "#1E5389",
              width: 1,
              type: "solid",
            },
          },
        },
        series: [
          // {
          //   name: "2022年额度",
          //   type: "bar",
          //   data: [263.23, 402.18, 73.28, 144.80, 25.56, 8.23, 0, 12.97, 8.56, -1.72, 0, 0, 0, 76.90, 5.03, 9.14, 0, 0],
          //   showBackground: false,
          //   backgroundStyle: {
          //     color: "#18416F",
          //   },
          //   barWidth: "10%",
          //   itemStyle: {
          //     barBorderRadius: [10, 10, 0, 0],
          //     color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
          //       {
          //         offset: 0,
          //         color: '#082550',
          //       },
          //       {
          //         offset: 1,
          //         color: '#69c0ff',
          //       },
          //     ]),
          //   },
          // },
          {
            name: "2023年额度",
            type: "bar",
            data: common3,
            showBackground: false,
            backgroundStyle: {
              color: "#18416F",
            },
            barWidth: "30%",
            itemStyle: {
              // barBorderRadius: [10, 10, 0, 0],
              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                {
                  offset: 0,
                  color: '#082550',
                },
                {
                  offset: 1,
                  color: '#957DFF',

                },
              ]),
            },
          },
        ],
        legend: {
          // data: ["2022年额度", "2023年额度"],
          data: ["2023年额度"],
          textStyle: {
            // 图列内容样式
            color: "#fff", // 字体颜色
            fontSize: "20",
            fontFamily: 'Microsoft YaHei'
          },
          right: 'center',
          y: 5,
          // 小图标的宽高
        },
      };
      tools.loopShowTooltip(this.myChartTip1, option, {
        nterval: 2000,
        loopSeries: true,
      })
      let that = this
      that.myChartTip1.on('click', function (param) {
        if (that.versions) {
          if (location == 'right') {
            that.rightPenetrateTwo('', '', that.findCode(param.name))
          } else if (location == 'left') {
            that.leftPenetrateTwo(mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, param.name)
          } else if (location == 'center') {
            that.centerPenetrateTwo(typeCTwo, paramCTwo, that.findCode(param.name), portType)
          }
        } else {
          that.projectListTipShow = true
        }
      })
      that.myChartTip1.setOption(option);
    },
    initChartLTip2 (location, mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, type, param, typeCTwo, paramCTwo, portType) {
      this.myChartTip2 = echarts.init(document.getElementById("echartSingleTip2"));
      let option = {
        grid: {
          top: 40,
          right: 0,
          left: 60,
          bottom: '15%',
        },
        tooltip: {
          show: true,
          trigger: "axis",
          axisPointer: {
            // 坐标轴指示器，坐标轴触发有效
            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: this.changeLine ? commonCompany : this.lineCommonCompany,
          axisTick: {
            show: false,
          },
          // x轴的字体颜色
          axisLabel: {
            rotate: 40,
            textStyle: {
              color: "white",
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
          //y轴线的颜色以及宽度
          axisLine: {
            show: true,
            lineStyle: {
              color: "#1E5389",
              width: 1,
              type: "solid",
            },
          },
        },
        yAxis: {
          name: '个',
          nameTextStyle: {//y轴上方单位的颜色
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          axisTick: {
            lineStyle: {
              color: "#18416F",
            },
          },
          // y轴的字体颜色
          axisLabel: {
            textStyle: {
              color: "#fff",
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: '#68b4dd66',
              type: 'dashed',
            },
          },
          //y轴线的颜色以及宽度
          axisLine: {
            show: true,
            lineStyle: {
              color: "#1E5389",
              width: 1,
              type: "solid",
            },
          },
        },
        series: [
          {
            name: "2023年额度",
            type: this.changeLine ? "bar" : 'line',
            data: common4,
            showBackground: false,
            backgroundStyle: {
              color: "#18416F",
            },
            barWidth: "30%",
            itemStyle: {
              // barBorderRadius: [10, 10, 0, 0],
              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                {
                  offset: 0,
                  color: '#082550',
                },
                {
                  offset: 1,
                  color: '#957DFF',

                },
              ]),
            },
          },
        ],
        legend: {
          // data: ["2022年额度", "2023年额度"],
          data: ["2023年额度"],
          textStyle: {
            // 图列内容样式
            color: "#fff", // 字体颜色
            fontSize: "20",
            fontFamily: 'Microsoft YaHei'
          },
          right: 'center',
          y: 0,
          // 小图标的宽高
        },
      };
      tools.loopShowTooltip(this.myChartTip2, option, {
        nterval: 2000,
        loopSeries: true,
      })
      let that = this
      that.myChartTip2.on('click', function (param) {
        if (that.versions) {
          if (location == 'right') {
            that.rightPenetrateTwo('', '', that.findCode(param.name))
          } else if (location == 'left') {
            that.leftPenetrateTwo(mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, param.name)
          } else if (location == 'center') {
            that.centerPenetrateTwo(typeCTwo, paramCTwo, that.findCode(param.name), portType)
          }
        } else {
          that.projectListTipShow = true
        }
      })
      that.myChartTip2.setOption(option);
    },
    initChartLTip3 (location, mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, type, param, typeCTwo, paramCTwo, portType) {
      this.myChartTip3 = echarts.init(document.getElementById("echartSingleTip3"));
      let option = {
        grid: {
          top: 40,
          right: 0,
          left: 60,
          bottom: '15%',
        },
        tooltip: {
          show: true,
          trigger: "axis",
          axisPointer: {
            // 坐标轴指示器，坐标轴触发有效
            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: commonCompany,
          axisTick: {
            show: false,
          },
          // x轴的字体颜色
          axisLabel: {
            rotate: 40,
            textStyle: {
              color: "#fff",
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
          //y轴线的颜色以及宽度
          axisLine: {
            show: true,
            lineStyle: {
              color: "#1E5389",
              width: 1,
              type: "solid",
            },
          },
        },
        yAxis: {
          name: '亿',
          nameTextStyle: {//y轴上方单位的颜色
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          axisTick: {
            lineStyle: {
              color: "#18416F",
            },
          },
          // y轴的字体颜色
          axisLabel: {
            textStyle: {
              color: "#fff",
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: '#68b4dd66',
              type: 'dashed',
            },
          },
          //y轴线的颜色以及宽度
          axisLine: {
            show: true,
            lineStyle: {
              color: "#1E5389",
              width: 1,
              type: "solid",
            },
          },
        },
        series: [,
          {
            name: "2023年额度",
            type: "bar",
            data: common5,
            showBackground: false,
            backgroundStyle: {
              color: "#18416F",
            },
            barWidth: "30%",
            itemStyle: {
              // barBorderRadius: [10, 10, 0, 0],
              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                {
                  offset: 0,
                  color: '#082550',
                },
                {
                  offset: 1,
                  color: '#69c0ff',
                },
              ]),
            },
          },
        ],
        legend: {
          data: ["2023年额度"],
          textStyle: {
            // 图列内容样式
            color: "#fff", // 字体颜色
            fontSize: "20",
            fontFamily: 'Microsoft YaHei'
          },
          right: 'center',
          y: 5,
        },
      };
      tools.loopShowTooltip(this.myChartTip3, option, {
        nterval: 2000,
        loopSeries: true,
      })
      let that = this
      that.myChartTip3.on('click', function (param) {
        if (that.versions) {
          if (location == 'right') {
            that.rightPenetrateTwo('', '', that.findCode(param.name))
          } else if (location == 'left') {
            that.leftPenetrateTwo(mdnb_textfield11, mdnb_textfield13, mdnb_textfield16, mdnb_textfield23, param.name)
          } else if (location == 'center') {
            that.centerPenetrateTwo(typeCTwo, paramCTwo, that.findCode(param.name), portType)
          }
        } else {
          that.projectListTipShow = true
        }
      })
      that.myChartTip3.setOption(option);
    },
    closeTap () {
      this.changeLine = true
      this.echartEnterpriseShow = false
      this.mapTipShow = false
      this.echartSingleTipShow = false
      this.echartDoubleTipShow = false
      this.projectListTipShow = false
      this.myChartTip1 ? this.myChartTip1.dispose() : ''
      this.myChartTip2 ? this.myChartTip2.dispose() : ''
      this.myChartTip3 ? this.myChartTip3.dispose() : ''
    },
    //点击弹窗左半部分
    popLeftClick () {
      if (this.titleUrl == '2.png') {
        this.titleUrl = '3.png'
      } else if (this.titleUrl == '7.png') {
        this.titleUrl = '8.png'
      } else if (this.titleUrl == '3.png') {
        this.titleUrl = '2.png'
      } else if (this.titleUrl == '8.png') {
        this.titleUrl = '7.png'
      } else if (this.titleUrl == '5.png') {
        this.titleUrl = '2.png'
      } else if (this.titleUrl == '10.png') {
        this.titleUrl = '7.png'
      }
    },
    //点击弹窗右半部分
    poprightClick () {
      if (this.titleUrl == '2.png') {
        this.titleUrl = '5.png'
      } else if (this.titleUrl == '7.png') {
        this.titleUrl = '10.png'
      } else if (this.titleUrl == '5.png') {
        this.titleUrl = '2.png'
      } else if (this.titleUrl == '10.png') {
        this.titleUrl = '7.png'
      } else if (this.titleUrl == '3.png') {
        this.titleUrl = '2.png'
      } else if (this.titleUrl == '8.png') {
        this.titleUrl = '7.png'
      }
    },
    // 标题弹窗
    showTitlePop (e, name) {
      this.closeTap()
      this.titleUrl = e
      this.titleName = name
      this.$nextTick(() => {
        this.mapTipShow = true
      })
    },
    changeYellow () {
      this.titleList.forEach((item, index) => {
        this.$set(this.titleList[index], 'type', 1)
      })
      this.$set(this.titleList[this.yellowCount], 'type', 2)
      if (this.yellowCount == 14) {
        this.yellowCount = 0
        this.yellowPosition += 315
      } else {
        if (this.yellowCount != 0) {
          this.yellowPosition += 315
        } else {
          this.yellowPosition = 40
        }
        this.yellowCount += 2
      }
    },
    numFormat (value) {
      if (!value) return '0'
      // var intPart = Number(value).toFixed(0) // 获取整数部分
      var intPart = parseInt(value)// 获取整数部分
      var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断
      var floatPart = '.00' // 预定义小数部分
      var value2Array = value.toString().split('.')
      // =2表示数据有小数位
      if (value2Array.length === 2) {
        floatPart = value2Array[1].toString() // 拿到小数部分
        if (floatPart.length === 1) {
          // 补0
          return intPartFormat + '.' + floatPart + '0'
        } else {
          return intPartFormat + '.' + floatPart
        }
      } else {
        return intPartFormat
      }
    },
    changeTopColor () {
      this.list = document.getElementsByClassName('row-item')
      for (var i = 0; i < this.list.length; i++) {
        if (i == 1) {
          this.list[i].classList.add('light')
        } else {
          this.list[i].classList.remove('light')
        }
      }
      this.initChartL9()
    },
    scrollChange (index) {
      if (index == 18) {
        this.count = -1
      } else {
        this.count = index
      }
      if (this.count > 12 && this.count != 18) {
        this.countType = 1
      } else {
        this.countType = 0
      }
      for (var i = 0; i < this.list.length; i++) {
        if (i == 2) {
          this.list[i].classList.add('light')
        } else {
          this.list[i].classList.remove('light')
        }
      }
      this.chartCarousel.dispose()
      this.initChartL9()
    },
    initChartBall () {
      this.left11Chart = echarts.init(this.$refs['echartBall'])
      option = {
        series: [
          {
            type: "liquidFill",
            radius: "80%",
            data: [left2[0], left2[0] + 0.02, left2[0] - 0.02],
            amplitude: '4%',
            waveLength: '20%', //波浪长度
            // data: [
            //   {}
            // ],
            backgroundStyle: {
              color: {
                type: "radial",
                x: 0.5,
                y: 0.5,
                r: 0.5,
                // 水球体颜色
                colorStops: [
                  {
                    offset: 0,
                    color: "#010a11",
                  },
                  {
                    offset: 0.9,
                    color: "#1a2f45",
                  },
                  {
                    offset: 1,
                    color: "#2b405a",
                  },
                ],
                globalCoord: false,
              },
            },
            outline: {
              borderDistance: 0,
              itemStyle: {
                borderWidth: 0,
                borderColor: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [
                  ],
                  globalCoord: false,
                },
              },
            },
            color: [
              {
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                  offset: 0,
                  color: '#237386',
                },
                {
                  offset: 1,
                  color: '#0078C8',
                },],
              },
              {
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                  offset: 0,
                  color: '#2F97A9',
                },
                {
                  offset: 1,
                  color: '#0078C8',
                },],
              },
              {
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                  offset: 0,
                  color: '#48E0ED',
                },
                {
                  offset: 1,
                  color: '#0078C8',
                },],
              }
            ],
            label: {
              normal: {
                textStyle: {
                  color: "#fff", // x轴文字颜色
                  fontSize: '70'
                },
              },
            },
          },
        ],
      };
      this.left11Chart.setOption(option)
    },
    initChartL1 () {
      this.left9Chart = echarts.init(this.$refs['echartL1'])
      option = {
        series: [
          {
            type: "liquidFill",
            radius: "80%",
            data: [left2[0], left2[0] + 0.02, left2[0] - 0.02],
            amplitude: '4%',
            // period:'1500',
            waveLength: '20%', //波浪长度
            // data: [
            //   {}
            // ],
            backgroundStyle: {
              color: {
                type: "radial",
                x: 0.5,
                y: 0.5,
                r: 0.5,
                // 水球体颜色
                colorStops: [
                  {
                    offset: 0,
                    color: "#010a11",
                  },
                  {
                    offset: 0.9,
                    // color: "#203852",
                    color: "#1a2f45",
                  },
                  {
                    offset: 1,
                    // color: "#354e6d",
                    color: "#2b405a",
                    // color: "#314967",
                  },
                ],
                globalCoord: false,
              },
            },
            outline: {
              borderDistance: 0,
              itemStyle: {
                borderWidth: 0,
                borderColor: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [
                  ],
                  globalCoord: false,
                },
              },
            },
            color: [
              {
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                  offset: 0,
                  color: '#237386',
                },
                {
                  offset: 1,
                  color: '#0078C8',
                },],
              },
              {
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                  offset: 0,
                  color: '#2F97A9',
                },
                {
                  offset: 1,
                  color: '#0078C8',
                },],
              },
              {
                x: 0,
                y: 0,
                x2: 0,
                y2: 1,
                colorStops: [{
                  offset: 0,
                  color: '#48E0ED',
                },
                {
                  offset: 1,
                  color: '#0078C8',
                },],
              }
            ],
            label: {
              normal: {
                textStyle: {
                  color: "#fff", // x轴文字颜色
                },
              },
            },
          },
        ],
      };

      this.left9Chart.setOption(option)
    },
    initChartL2 () {
      var chartData = left5
      var timer = null;
      var i = 0;
      let that = this
      var option = {
        colors: ['#064F78', '#623726', '#955773', , '#B57C63', '#BDB35D', '#73A88E', '#09736D', '#13400B', '#0D3265'],
        chart: {
          type: 'pie',
          backgroundColor: 'rgba(0,0,0,0)',
          options3d: {
            enabled: true,
            alpha: 45,
            //beta: 0
          },
          events: {
            // load，图表加载完成时触发
            load: function () {
              var chart = this;

              var points = chart.series[0].points;
              var len = points.length;

              timer && clearInterval(timer);
              timer = setInterval(function () {
                autoTooltip(points[i]);
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                  if (index == i) {
                    // item.sliced = true
                    // item.selected = true
                  }
                })
                that.left1Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                i++;
                if (i === len) {
                  i = 0;
                  chartData.forEach((item, index) => {
                    // item.sliced = false
                    // item.selected = false
                  })
                  that.left1Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                }
              }, 2000);
            },
            legendItemClick: function (event) {
              return true;
            }
          }
        },
        credits: {
          enabled: false  //去掉hightchats水印
        },
        legend: {
          // labelFormatter: function() {
          //     return 123;
          // },
          align: 'right',//横向位置
          verticalAlign: 'middle', // 纵向位置
          layout: "vertical",//横排还是竖排
          x: -110,
          y: 90,
          symbolWidth: 50,
          itemStyle: {
            fontSize: '20px',
            color: '#fff',
            x: 20,
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          },
        },
        title: {
          text: '主辅业计划占比',
          style: {
            color: '#fff',
            fontSize: 24,
            fontFamily: 'Microsoft YaHei',
          },
          align: 'center',
          verticalAlign: "bottom",
          x: -120
        },
        tooltip: {
          crosshairs: false,
          backgroundColor: 'rgba(0,0,0,0.5)',
          // positioner: function(e){
          //   console.log(e, this)
          // },
          // useHTML: false, //开启html模式
          style: {
            color: '#fff',
            fontSize: '20',
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          },
          formatter: function (e) {
            let num = chartData[this.colorIndex].num
            this.percentage = this.percentage.toFixed(2) //Math.round(this.percentage)
            return `${this.key}：<b>${this.percentage}%</b><br/><b>${this.y}</b>亿，<b>${num}个</b>`
          },
          //pointFormat: 
        },
        plotOptions: {
          pie: {
            allowPointSelect: true,
            showInLegend: true, // 图例
            cursor: 'pointer',
            size: 220,
            innerSize: 150, //环形图中间空白，0为饼图
            depth: 25, //立体高度
            slicedOffset: 21, //动画距离
            dataLabels: {
              enabled: false,  // 是否展示指示线
              format: '{point.name}: {point.percentage}'
            }
          },
        },
        series: [{
          type: 'pie',
          name: '占比',
          center: ['50%', '50%'],
          point: {
            events: {
              click: function (e) { //点击事件
                that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
              },
              mouseOver: function (e) { //鼠标移入停止轮播并且找到移入的当前数据设为选中
                chartData.forEach((item, index) => {
                  // item.sliced = false
                  // item.selected = false
                })
                // chartData[e.target.index].sliced = true
                // chartData[e.target.index].selected = true
                that.left1Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                timer && clearInterval(timer);
              },
              mouseOut: function () { // 鼠标移出后需要继续执行轮播
                var points = that.left1Chart.series[0].points;
                var len = points.length;

                timer && clearInterval(timer);
                timer = setInterval(function () {
                  autoTooltip(points[i]);
                  chartData.forEach((item, index) => {
                    // item.sliced = false
                    // item.selected = false
                    if (index == i) {
                      // item.sliced = true
                      // item.selected = true
                    }
                  })
                  that.left1Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                  i++;
                  if (i === len) {
                    i = 0;
                    chartData.forEach((item, index) => {
                      item.sliced = false
                      item.selected = false
                    })
                    that.left1Chart.update({
                      series: [{
                        type: 'pie',
                        name: '占比',
                        point: {
                          events: {
                            click: function (e) {
                              that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                            }
                          }
                        },
                        data: chartData
                      }]
                    })
                  }
                }, 2000);
              }
            }
          },
          data: chartData
        }]
      }

      that.left1Chart = Highcharts.chart('echartL2', option);
      function autoTooltip (point) {
        that.left1Chart.tooltip.refresh(point);
      }
    },
    initChartL3 () {
      var chartData = left6
      var timer = null;
      var i = 0;

      let that = this
      that.left2Chart = Highcharts.chart('echartL3', {
        colors: ['#064F78', '#623726', '#955773', , '#B57C63', '#BDB35D', '#73A88E', '#09736D', '#13400B', '#0D3265'],
        chart: {
          type: 'pie',
          backgroundColor: 'rgba(0,0,0,0)',
          options3d: {
            enabled: true,
            alpha: 45,
            //beta: 0
          },
          events: {
            // load，图表加载完成时触发
            load: function () {
              var chart = this;

              var points = chart.series[0].points;
              var len = points.length;

              timer && clearInterval(timer);
              timer = setInterval(function () {
                autoTooltip(points[i]);
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                  if (index == i) {
                    // item.sliced = true
                    // item.selected = true
                  }
                })
                that.left2Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                i++;
                if (i === len) {
                  i = 0;
                  chartData.forEach((item, index) => {
                    // item.sliced = false
                    // item.selected = false
                  })
                  that.left2Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                }
              }, 2000);
            },
            legendItemClick: function (event) {
              that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
              return true;
            }
          }
        },
        credits: {
          enabled: false  //去掉hightchats水印
        },
        legend: {
          // labelFormatter: function() {
          //     return 123;
          // },
          align: 'right',//横向位置
          verticalAlign: 'middle', // 纵向位置
          layout: "vertical",//横排还是竖排
          x: -70,
          y: 90,
          symbolWidth: 50,
          itemStyle: {
            fontSize: '20px',
            color: '#fff',
            x: 20,
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          },
        },
        title: {
          text: '项目管理类型',
          style: {
            color: '#fff',
            fontSize: 24,
            fontFamily: 'Microsoft YaHei'
          },
          align: 'center',
          verticalAlign: "bottom",
          x: -120
        },
        tooltip: {
          crosshairs: true,
          backgroundColor: 'rgba(0,0,0,0.5)',
          // positioner: function(e){
          //   console.log(e, this)
          // },
          useHTML: false, //开启html模式
          style: {
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          formatter: function (e) {
            //console.log(this)
            let num = chartData[this.colorIndex].num
            this.percentage = this.percentage.toFixed(2) //Math.round(this.percentage)
            return `${this.key}：<b>${this.percentage}%</b><br/><b>${this.y}</b>亿，<b>${num}个</b>`
          },
          //pointFormat: 
        },
        plotOptions: {
          pie: {
            allowPointSelect: true,
            showInLegend: true, // 图例
            cursor: 'pointer',
            size: 220,
            innerSize: 150, //环形图中间空白，0为饼图
            depth: 25, //立体高度
            slicedOffset: 21, //动画距离
            dataLabels: {
              enabled: false,  // 是否展示指示线
              format: '{point.name}: {point.percentage}'
            }
          },
        },
        series: [{
          type: 'pie',
          name: '占比',
          // center: ['70%', '50%'],
          point: {
            events: {
              click: function (e) { //点击事件
                that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
              },
              mouseOver: function (e) { //鼠标移入停止轮播并且找到移入的当前数据设为选中
                //console.log(e) 
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                })
                // chartData[e.target.index].sliced = true
                // chartData[e.target.index].selected = true
                that.left2Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                timer && clearInterval(timer);
              },
              mouseOut: function () { // 鼠标移出后需要继续执行轮播
                var points = that.left2Chart.series[0].points;
                var len = points.length;

                timer && clearInterval(timer);
                timer = setInterval(function () {
                  autoTooltip(points[i]);
                  chartData.forEach((item, index) => {
                    item.sliced = false
                    item.selected = false
                    if (index == i) {
                      // item.sliced = true
                      // item.selected = true
                    }
                  })
                  that.left2Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'left', '投资计划分析', e.point.name, '', '')
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                  i++;
                  if (i === len) {
                    i = 0;
                    chartData.forEach((item, index) => {
                      item.sliced = false
                      item.selected = false
                    })
                    that.left2Chart.update({
                      series: [{
                        type: 'pie',
                        name: '占比',
                        point: {
                          events: {
                            click: function (e) {
                              console.log(e)
                            }
                          }
                        },
                        data: chartData
                      }]
                    })
                  }
                }, 2000);
              }
            }
          },
          data: chartData
        }]
      });

      function autoTooltip (point) {
        that.left2Chart.tooltip.refresh(point);
      }
    },
    initChartL4 (dataList) {
      this.left10Chart = echarts.init(document.getElementById("echartL4"));
      let option = {
        grid: {
          top: 45,
          right: 0,
          left: 60,
          bottom: 80,
        },
        tooltip: {
          show: true,
          trigger: "axis",
          formatter: data => {
            return `${data[0].name}<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[0].color.colorStops[0].color}"></span> ${data[0].seriesName}：${data[0].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[1].color.colorStops[0].color}"></span> ${data[1].seriesName}：${data[1].value}亿`
          },
          axisPointer: {
            // 坐标轴指示器，坐标轴触发有效
            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: commonCompany,
          axisTick: {
            show: false,
          },
          // x轴的字体颜色
          axisLabel: {
            rotate: 40,
            textStyle: {
              color: "white",
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
          //y轴线的颜色以及宽度
          axisLine: {
            show: true,
            lineStyle: {
              color: "#1E5389",
              width: 1,
              type: "solid",
            },
          },
        },
        yAxis: {
          name: '亿',
          axisTick: {
            lineStyle: {
              color: "#18416F",
            },
          },
          // y轴的字体颜色
          axisLabel: {
            textStyle: {
              color: "white",
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: "#68b4dd66",
              width: 1,
              type: "dashed",
            },
          },
          //y轴线的颜色以及宽度
          axisLine: {
            show: true,
            lineStyle: {
              color: "#1E5389",
              width: 1,
              type: "solid",
            },
          },
          nameTextStyle: {
            color: '#fff',
            fontSize: 20,
            fontFamily: 'Microsoft YaHei'
          },
        },
        series: [
          {
            name: "2023年额度",
            type: "bar",
            data: left3[0],
            stack: 'Ad',
            showBackground: false,
            backgroundStyle: {
              color: "#18416F",
            },
            barWidth: "20",
            itemStyle: {
              // barBorderRadius: [10, 10, 0, 0],
              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                {
                  offset: 0,
                  color: '#082550',
                },
                {
                  offset: 1,
                  color: '#3986F8',

                },
              ]),
            },
          },
          {
            name: "总额度",
            type: "bar",
            data: left3[0],
            stack: 'Ad',
            showBackground: false,
            backgroundStyle: {
              color: "#18416F",
            },
            barWidth: "20",
            itemStyle: {
              // barBorderRadius: [10, 10, 0, 0],
              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
                {
                  offset: 0,
                  color: '#b9b7c060',
                },
                {
                  offset: 1,
                  color: '#b9b7c060',
                },
              ]),
            },
          },
        ],
        legend: {
          // data: ["2022年额度", "2023年额度"],
          data: ["2023年额度"],
          textStyle: {
            // 图列内容样式
            color: "#fff", // 字体颜色
            fontSize: "20",
            fontFamily: 'Microsoft YaHei'
          },
          right: 'center',
          y: 5,
          // icon: "roundRect",
          // 小图标的宽高
        },
      };
      let that = this
      tools.loopShowTooltip(that.left10Chart, option, {
        nterval: 2000,
        loopSeries: true,
      })
      that.left10Chart.on('click', function (param) {
        that.titleName = param.name
        that.echartEnterpriseShow = true
        // 如果是接口版数据版
        if (that.versions) {
          let findData = dataList.find(item => {
            return item.mdnb_textfield == param.name
          })
          common1[0] = findData.mdnb_amountfield18
          common1[1] = findData.mdnb_amountfield20
          common1[2] = findData.mdnb_amountfield19
          common1[3] = findData.mdnb_amountfield26
          common1[4] = findData.mdnb_amountfield27
          common1[5] = findData.mdnb_amountfield25
          common2[0] = findData.mdnb_decimalfield6
        }
        setTimeout(() => {
          that.initChartBall()
        });
      })
      that.left10Chart.setOption(option);
    },
    initChartL5 () {
      var chartData = left7
      var timer = null;
      var i = 0;
      let that = this
      var option = {
        colors: ['#064F78', '#623726', '#955773', , '#B57C63', '#BDB35D', '#73A88E', '#09736D', '#13400B', '#0D3265'],
        chart: {
          type: 'pie',
          backgroundColor: 'rgba(0,0,0,0)',
          options3d: {
            enabled: true,
            alpha: 45,
            //beta: 0
          },
          events: {
            // load，图表加载完成时触发
            load: function () {
              var chart = this;

              var points = chart.series[0].points;
              var len = points.length;

              timer && clearInterval(timer);
              timer = setInterval(function () {
                autoTooltip(points[i]);
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                  if (index == i) {
                    item.sliced = true
                    item.selected = true
                  }
                })
                that.left3Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          // that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '传统产业分析', e.point.name, '')
                          that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '优势特色产业', '体育产业', '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                i++;
                if (i === len) {
                  i = 0;
                }
              }, 2000);
            },
            legendItemClick: function (event) {
              console.log(event);
              return true;
            }
          }
        },
        credits: {
          enabled: false  //去掉hightchats水印
        },
        legend: {
          // labelFormatter: function() {
          //     return 123;
          // },
          align: 'right',//横向位置
          verticalAlign: 'middle', // 纵向位置
          layout: "vertical",//横排还是竖排
          x: -110,
          y: 50,
          symbolWidth: 50,
          itemDistance: 50,
          itemStyle: {
            fontSize: '20px',
            color: '#fff',
            x: 20,
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          },
        },
        title: {
          text: '传统产业分析',
          style: {
            color: '#fff',
            fontSize: 24,
            fontFamily: 'Microsoft YaHei'
          },
          align: 'center',
          verticalAlign: "bottom",
          x: -120
        },
        tooltip: {
          crosshairs: true,
          backgroundColor: 'rgba(0,0,0,0.5)',
          // positioner: function(e){
          //   console.log(e, this)
          // },
          useHTML: false, //开启html模式
          style: {
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          formatter: function (e) {
            //console.log(this)
            let num = chartData[this.colorIndex].num
            this.percentage = this.percentage.toFixed(2) //Math.round(this.percentage)
            return `${this.key}：<b>${this.percentage}%</b><br/><b>${this.y}</b>亿，<b>${num}个</b>`
          },
          //pointFormat: 
        },
        plotOptions: {
          pie: {
            allowPointSelect: true,
            showInLegend: true, // 图例
            cursor: 'pointer',
            size: 220,
            innerSize: 150, //环形图中间空白，0为饼图
            depth: 25, //立体高度
            slicedOffset: 21, //动画距离
            dataLabels: {
              enabled: false,  // 是否展示指示线
              format: '{point.name}: {point.percentage}'
            }
          },
        },
        series: [{
          type: 'pie',
          name: '占比',
          //center: ['35%','50%'],
          point: {
            events: {
              click: function (e) { //点击事件
                // that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '传统产业分析', e.point.name, '')
                that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '优势特色产业', '体育产业', '')
              },
              mouseOver: function (e) { //鼠标移入停止轮播并且找到移入的当前数据设为选中
                //console.log(e) 
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                })
                chartData[e.target.index].sliced = true
                chartData[e.target.index].selected = true
                that.left3Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          // that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '传统产业分析', e.point.name, '')
                          that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '优势特色产业', '体育产业', '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                timer && clearInterval(timer);
              },
              mouseOut: function () { // 鼠标移出后需要继续执行轮播
                var points = that.left3Chart.series[0].points;
                var len = points.length;

                timer && clearInterval(timer);
                timer = setInterval(function () {
                  autoTooltip(points[i]);
                  chartData.forEach((item, index) => {
                    item.sliced = false
                    item.selected = false
                    if (index == i) {
                      item.sliced = true
                      item.selected = true
                    }
                  })
                  that.left3Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            // that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '传统产业分析', e.point.name, '')
                            that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '优势特色产业', '体育产业', '')
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                  i++;
                  if (i === len) {
                    i = 0;
                  }
                }, 2000);
              }
            }
          },
          data: chartData
        }]
      }

      that.left3Chart = Highcharts.chart('echartL5', option);

      function autoTooltip (point) {
        that.left3Chart.tooltip.refresh(point);
      }
    },
    initChartL6 () {
      var chartData = left8
      var timer = null;
      var i = 0;

      let that = this

      var option = {
        colors: ['#064F78', '#623726', '#955773', , '#B57C63', '#BDB35D', '#73A88E', '#09736D', '#13400B', '#0D3265'],
        chart: {
          type: 'pie',
          backgroundColor: 'rgba(0,0,0,0)',
          options3d: {
            enabled: true,
            alpha: 45,
            //beta: 0
          },
          events: {
            // load，图表加载完成时触发
            load: function () {
              var chart = this;

              var points = chart.series[0].points;
              var len = points.length;

              timer && clearInterval(timer);
              timer = setInterval(function () {
                autoTooltip(points[i]);
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                  if (index == i) {
                    item.sliced = true
                    item.selected = true
                  }
                })
                that.left4Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '战略性新兴产业', e.point.name, '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                i++;
                if (i === len) {
                  i = 0;
                }
              }, 2000);
            },
            legendItemClick: function (event) {
              console.log(event);
              return true;
            }
          }
        },
        credits: {
          enabled: false  //去掉hightchats水印
        },
        legend: {
          // labelFormatter: function() {
          //     return 123;
          // },
          align: 'right',//横向位置
          verticalAlign: 'middle', // 纵向位置
          layout: "vertical",//横排还是竖排
          x: -30,
          y: 30,
          symbolWidth: 50,
          itemDistance: 50,
          itemStyle: {
            fontSize: '20px',
            color: '#fff',
            x: 20,
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          },
        },
        title: {
          text: '战略性新兴产业',
          style: {
            color: '#fff',
            fontSize: 24,
            fontFamily: 'Microsoft YaHei'
          },
          align: 'center',
          verticalAlign: "bottom",
          x: -120
        },
        tooltip: {
          crosshairs: true,
          backgroundColor: 'rgba(0,0,0,0.5)',
          // positioner: function(e){
          //   console.log(e, this)
          // },
          useHTML: false, //开启html模式
          style: {
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          formatter: function (e) {
            //console.log(this)
            let num = chartData[this.colorIndex].num
            this.percentage = this.percentage.toFixed(2) //Math.round(this.percentage)
            return `${this.key}：<b>${this.percentage}%</b><br/><b>${this.y}</b>亿，<b>${num}个</b>`
          },
          //pointFormat: 
        },
        plotOptions: {
          pie: {
            allowPointSelect: true,
            showInLegend: true, // 图例
            cursor: 'pointer',
            size: 220,
            innerSize: 150, //环形图中间空白，0为饼图
            depth: 25, //立体高度
            slicedOffset: 21, //动画距离
            dataLabels: {
              enabled: false,  // 是否展示指示线
              format: '{point.name}: {point.percentage}'
            }
          },
        },
        series: [{
          type: 'pie',
          name: '占比',
          //center: ['35%','50%'],
          point: {
            events: {
              click: function (e) { //点击事件
                that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '战略性新兴产业', e.point.name, '')
              },
              mouseOver: function (e) { //鼠标移入停止轮播并且找到移入的当前数据设为选中
                //console.log(e) 
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                })
                chartData[e.target.index].sliced = true
                chartData[e.target.index].selected = true
                that.left4Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '战略性新兴产业', e.point.name, '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                timer && clearInterval(timer);
              },
              mouseOut: function () { // 鼠标移出后需要继续执行轮播
                var points = that.left4Chart.series[0].points;
                var len = points.length;

                timer && clearInterval(timer);
                timer = setInterval(function () {
                  autoTooltip(points[i]);
                  chartData.forEach((item, index) => {
                    item.sliced = false
                    item.selected = false
                    if (index == i) {
                      item.sliced = true
                      item.selected = true
                    }
                  })
                  that.left4Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '战略性新兴产业', e.point.name, '')
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                  i++;
                  if (i === len) {
                    i = 0;
                  }
                }, 2000);
              }
            }
          },
          data: chartData
        }]
      }

      that.left4Chart = Highcharts.chart('echartL6', option);

      function autoTooltip (point) {
        that.left4Chart.tooltip.refresh(point);
      }
    },
    initChartL7 () {
      var chartData = left9
      var timer = null;
      var i = 0;

      let that = this

      var option = {
        colors: ['#064F78', '#623726', '#955773', , '#B57C63', '#BDB35D', '#73A88E', '#09736D', '#13400B', '#0D3265'],
        chart: {
          type: 'pie',
          backgroundColor: 'rgba(0,0,0,0)',
          options3d: {
            enabled: true,
            alpha: 45,
            //beta: 0
          },
          events: {
            // load，图表加载完成时触发
            load: function () {
              var chart = this;

              var points = chart.series[0].points;
              var len = points.length;

              timer && clearInterval(timer);
              timer = setInterval(function () {
                autoTooltip(points[i]);
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                  if (index == i) {
                    item.sliced = true
                    item.selected = true
                  }
                })
                that.left5Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '特色优势产业', e.point.name, '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                i++;
                if (i === len) {
                  i = 0;
                }
              }, 2000);
            },
            legendItemClick: function (event) {
              console.log(event);
              return true;
            }
          }
        },
        credits: {
          enabled: false  //去掉hightchats水印
        },
        title: {
          text: '特色优势产业',
          style: {
            color: '#fff',
            fontSize: 24,
            fontFamily: 'Microsoft YaHei'
          },
          align: 'center',
          verticalAlign: "bottom",
          x: -120
        },
        legend: {
          // labelFormatter: function() {
          //     return 123;
          // },
          align: 'right',//横向位置
          verticalAlign: 'middle', // 纵向位置
          layout: "vertical",//横排还是竖排
          x: -50,
          y: 30,
          symbolWidth: 50,
          itemDistance: 50,
          itemStyle: {
            fontSize: '20px',
            color: '#fff',
            x: 20,
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          },
        },
        tooltip: {
          crosshairs: true,
          backgroundColor: 'rgba(0,0,0,0.5)',
          // positioner: function(e){
          //   console.log(e, this)
          // },
          useHTML: false, //开启html模式
          style: {
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          formatter: function (e) {
            //console.log(this)
            let num = chartData[this.colorIndex].num
            this.percentage = this.percentage.toFixed(2) //Math.round(this.percentage)
            return `${this.key}：<b>${this.percentage}%</b><br/><b>${this.y}</b>亿，<b>${num}个</b>`
          },
          //pointFormat: 
        },
        plotOptions: {
          pie: {
            allowPointSelect: true,
            showInLegend: true, // 图例
            cursor: 'pointer',
            size: 220,
            innerSize: 150, //环形图中间空白，0为饼图
            depth: 25, //立体高度
            slicedOffset: 21, //动画距离
            dataLabels: {
              enabled: false,  // 是否展示指示线
              format: '{point.name}: {point.percentage}'
            }
          },
        },
        series: [{
          type: 'pie',
          name: '占比',
          //center: ['35%','50%'],
          point: {
            events: {
              click: function (e) { //点击事件
                that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '特色优势产业', e.point.name, '')
              },
              mouseOver: function (e) { //鼠标移入停止轮播并且找到移入的当前数据设为选中
                //console.log(e) 
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                })
                chartData[e.target.index].sliced = true
                chartData[e.target.index].selected = true
                that.left5Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '特色优势产业', e.point.name, '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                timer && clearInterval(timer);
              },
              mouseOut: function () { // 鼠标移出后需要继续执行轮播
                var points = that.left5Chart.series[0].points;
                var len = points.length;

                timer && clearInterval(timer);
                timer = setInterval(function () {
                  autoTooltip(points[i]);
                  chartData.forEach((item, index) => {
                    item.sliced = false
                    item.selected = false
                    if (index == i) {
                      item.sliced = true
                      item.selected = true
                    }
                  })
                  that.left5Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '特色优势产业', e.point.name, '')
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                  i++;
                  if (i === len) {
                    i = 0;
                  }
                }, 2000);
              }
            }
          },
          data: chartData
        }]
      }

      that.left5Chart = Highcharts.chart('echartL7', option);

      function autoTooltip (point) {
        that.left5Chart.tooltip.refresh(point);
      }

    },
    initChartL8 () {
      var chartData = left10
      var timer = null;
      var i = 0;

      let that = this

      var option = {
        colors: ['#064F78', '#623726', '#955773', , '#B57C63', '#BDB35D', '#73A88E', '#09736D', '#13400B', '#0D3265'],
        chart: {
          type: 'pie',
          backgroundColor: 'rgba(0,0,0,0)',
          options3d: {
            enabled: true,
            alpha: 45,
            //beta: 0
          },
          events: {
            // load，图表加载完成时触发
            load: function () {
              var chart = this;

              var points = chart.series[0].points;
              var len = points.length;

              timer && clearInterval(timer);
              timer = setInterval(function () {
                autoTooltip(points[i]);
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                  if (index == i) {
                    item.sliced = true
                    item.selected = true
                  }
                })
                that.left6Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '公共基础等产业', e.point.name, '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                i++;
                if (i === len) {
                  i = 0;
                }
              }, 2000);
            },
            legendItemClick: function (event) {
              console.log(event);
              return true;
            }
          }
        },
        credits: {
          enabled: false  //去掉hightchats水印
        },
        title: {
          text: '公共基础等产业',
          style: {
            color: '#fff',
            fontSize: 24,
            fontFamily: 'Microsoft YaHei'
          },
          align: 'center',
          verticalAlign: "bottom",
          x: -120
        },
        legend: {
          // labelFormatter: function() {
          //     return 123;
          // },
          align: 'right',//横向位置
          verticalAlign: 'middle', // 纵向位置
          layout: "vertical",//横排还是竖排
          x: -70,
          y: 50,
          symbolWidth: 50,
          itemDistance: 50,
          itemStyle: {
            fontSize: '20px',
            color: '#fff',
            x: 20,
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          },
        },
        tooltip: {
          crosshairs: true,
          backgroundColor: 'rgba(0,0,0,0.5)',
          // positioner: function(e){
          //   console.log(e, this)
          // },
          useHTML: false, //开启html模式
          style: {
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          formatter: function (e) {
            //console.log(this)
            let num = chartData[this.colorIndex].num
            this.percentage = this.percentage.toFixed(2) //Math.round(this.percentage)
            return `${this.key}：<b>${this.percentage}%</b><br/><b>${this.y}</b>亿，<b>${num}个</b>`
          },
          //pointFormat: 
        },
        plotOptions: {
          pie: {
            allowPointSelect: true,
            showInLegend: true, // 图例
            cursor: 'pointer',
            size: 220,
            innerSize: 150, //环形图中间空白，0为饼图
            depth: 25, //立体高度
            slicedOffset: 21, //动画距离
            dataLabels: {
              enabled: false,  // 是否展示指示线
              format: '{point.name}: {point.percentage}'
            }
          },
        },
        series: [{
          type: 'pie',
          name: '占比',
          //center: ['35%','50%'],
          point: {
            events: {
              click: function (e) { //点击事件
                that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '公共基础等产业', e.point.name, '')
              },
              mouseOver: function (e) { //鼠标移入停止轮播并且找到移入的当前数据设为选中
                //console.log(e) 
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                })
                chartData[e.target.index].sliced = true
                chartData[e.target.index].selected = true
                that.left6Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '公共基础等产业', e.point.name, '')
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                timer && clearInterval(timer);
              },
              mouseOut: function () { // 鼠标移出后需要继续执行轮播
                var points = that.left6Chart.series[0].points;
                var len = points.length;

                timer && clearInterval(timer);
                timer = setInterval(function () {
                  autoTooltip(points[i]);
                  chartData.forEach((item, index) => {
                    item.sliced = false
                    item.selected = false
                    if (index == i) {
                      item.sliced = true
                      item.selected = true
                    }
                  })
                  that.left6Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'left', '产业布局分析', '公共基础等产业', e.point.name, '')
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                  i++;
                  if (i === len) {
                    i = 0;
                  }
                }, 2000);
              }
            }
          },
          data: chartData
        }]
      }

      that.left6Chart = Highcharts.chart('echartL8', option);

      function autoTooltip (point) {
        that.left6Chart.tooltip.refresh(point);
      }
    },
    initChartL9 () {
      this.chartCarousel = echarts.init(document.getElementById("echartL9"));
      option = {
        tooltip: {
          trigger: 'axis',
          formatter: '指标：' + '{c0}' + '<br/>' + '发展线：' + '{c1}' + '<br/>' + '生存线：' + '{c2}',  //+ '<br/>'+ '{a1}：{c1}' + '%',
          axisPointer: {
            type: 'shadow',
          },
        },
        grid: {
          top: '10%',
          right: '5%',
          left: '12%',
          bottom: '15%',
        },
        xAxis: {
          // data: ['总投资收益率', '销售利润率', '成本费用利润率', '总资产周转率', '财务内部收益率'],
          data: left15[this.countType],
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          axisTick: {
            show: true, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            rotate: 30,
            textStyle: {
              color: '#fff', //X轴文字颜色
              fontSize: 20,
              fontFamily: 'Microsoft YaHei'
            },
          },
        },
        yAxis: [
          {
            type: 'value',
            splitLine: {
              show: true,
              lineStyle: {
                color: '#68b4dd66',
                type: 'dashed',
              },
            },
            axisLine: {
              show: false
            },
            axisLabel: {
              show: true,
              formatter: '{value}%',
              textStyle: {
                color: '#fff',
                fontSize: 20,
                fontFamily: 'Microsoft YaHei'
              },
            },
            nameTextStyle: {
              color: '#ebf8ac',
              fontSize: 16,
              fontFamily: 'Microsoft YaHei'
            },
          },
        ],
        series: [
          {
            name: '实际值',
            type: 'bar',
            barWidth: 20,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#69c0ff',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            // data: [70, 52, 33, 41, 52],
            data: left12[this.count + 1][2]
          },
          {
            name: '',
            type: 'line',
            barWidth: 15,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#69c0ff',
                  },
                  {
                    offset: 1,
                    color: 'green',
                  },
                ]),
              },
            },
            // data: [20, 30, 15, 28, 36],
            data: left12[this.count + 1][1]
          },
          {
            name: '',
            type: 'line',
            barWidth: 15,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#69c0ff',
                  },
                  {
                    offset: 1,
                    color: 'yellow',
                  },
                ]),
              },
            },
            // data: [15, 22, 17, 33, 14],
            data: left12[this.count + 1][0]
          },
        ],
      }
      let that = this
      // this.chartCarousel.on('click', function (param) {
      //   that.titleName = param.name
      //   that.echartSingleTipShow = true
      //   setTimeout(() => {
      //     that.initChartLTip()
      //   });
      // })
      this.chartCarousel.on('mouseover', (params) => {
        that.$refs.indicator.handleHover(true, 1, 2, 3, 4)
      })
      this.chartCarousel.on('mouseout', (params) => {
        that.$refs.indicator.handleHover(false, 1, 2, 3, 4)
      })
      this.chartCarousel.setOption(option)
      // tools.loopShowTooltip(myChart, option, {
      //   nterval: 2000,
      //   loopSeries: true,
      // })
    },
    initChartL10 () {
      this.left7Chart = echarts.init(document.getElementById("echartL10"));
      let option = {
        title: {
          text: '固定资产进度分布',
          textStyle: {
            color: '#69C0FF',
            fontSize: 30,
            fontWeight: 500,
            fontFamily: 'Microsoft YaHei'
          },
          top: '20',
          left: '20'
        },
        textStyle: {
          color: '#fff',
        },
        tooltip: {
          trigger: "axis",
          formatter: function (params) {
            var tip = params[0].axisValue + '<br/>' + params[0].marker + params[0].data[1] + '：' + params[0].data[2] + '个，' + params[0].data[3] + '亿' + '<br/>' + params[1].marker + params[1].data[1] + '：' + params[1].data[2] + '个，' + params[1].data[3] + '亿';
            return tip
          },
          textStyle: {
            color: '#ffffff',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
          axisPointer: {
            // lineStyle: {
            //   type: 'dashed',
            //   width: 2,
            //   color: 'rgba(255,255,255,0.6)'
            // },
            animation: false
          }
        },
        grid: {
          top: '0%',
          right: '5%',
          left: '15%',
          bottom: '-10%',
        },
        yAxis: {
          data: ['备案', '特别监管'],
          splitLine: {
            show: false,
            lineStyle: {
              color: '#68b4dd66',
              type: 'dashed',
            },
          },
          axisLine: {
            show: false
          },
          axisLabel: {
            show: true,
            formatter: '{value}',
            textStyle: {
              color: '#fff',
              fontSize: 20,
              padding: [0, -10, 0, 0],
              fontFamily: 'Microsoft YaHei',
            },
          },
          nameTextStyle: {
            color: '#ebf8ac',
            fontSize: 16,
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: ['项目储备', '项目立项', '可研论证', '投资决策'],
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          axisTick: {
            show: false, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            textStyle: {
              color: '#fff', //X轴文字颜色
              fontSize: 20,
              padding: [-320, 0, 0, 0],
              fontFamily: 'Microsoft YaHei'
            },
          }
        },
        series: [
          {
            name: '特别监管',
            type: 'scatter',
            symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
            symbolSize: function (data) {
              return Math.sqrt(data[2]) * 5;
            },
            // label: {
            //   emphasis: {
            //     show: true,
            //     formatter: function (param) {
            //       return param.data[2];
            //     },
            //     position: 'top'
            //   }
            // },
            itemStyle: {
              normal: {
                color: '#69c0ff'
              }
            },
            data: left13[0]
          },
          {
            name: '备案',
            type: 'scatter',
            symbol: 'circle',//'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
            symbolSize: function (data) {
              return Math.sqrt(data[2]) * 5;
            },
            // label: {
            //   emphasis: {
            //     show: true,
            //     formatter: function (param) {
            //       return param.data[2];
            //     },
            //     position: 'top'
            //   }
            // },
            itemStyle: {
              normal: {
                color: '#957DFF'
              }
            },
            data: left13[1]
          },
        ]
      }
      let that = this
      that.left7Chart.on('click', function (param) {
        that.showChartLTipDouble(param.name, 'left', '项目阶段分析', '固定资产', param.name, param.seriesName)
      })
      that.left7Chart.setOption(option)
      tools.loopShowTooltip(that.left7Chart, option, {
        nterval: 2000,
        loopSeries: true,
      })
    },
    initChartL11 () {
      this.left8Chart = echarts.init(document.getElementById("echartL11"));
      let option = {
        title: {
          text: '股权类进度分布',
          textStyle: {
            color: '#69C0FF',
            fontSize: 30,
            fontWeight: 500,
            fontFamily: 'Microsoft YaHei'
          },
          top: '20',
          left: '20'
        },
        textStyle: {
          color: '#fff',
        },
        tooltip: {
          trigger: "axis",
          formatter: function (params) {
            var tip = params[0].axisValue + '<br/>' + params[0].marker + params[0].data[1] + '：' + params[0].data[2] + '个，' + params[0].data[3] + '亿' + '<br/>' + params[1].marker + params[1].data[1] + '：' + params[1].data[2] + '个，' + params[1].data[3] + '亿';
            return tip
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
          axisPointer: {
            // lineStyle: {
            //   type: 'dashed',
            //   width: 2,
            //   color: 'rgba(255,255,255,0.6)'
            // },
            animation: true
          }
        },
        grid: {
          top: '0%',
          right: '5%',
          left: '15%',
          bottom: '-10%',
        },
        yAxis: {
          data: ['备案', '特别监管'],
          splitLine: {
            show: false,
            lineStyle: {
              color: '#68b4dd66',
              type: 'dashed',
            },
          },
          axisLine: {
            show: false
          },
          axisLabel: {
            show: true,
            formatter: '{value}',
            textStyle: {
              fontSize: 20,
              padding: [0, -10, 0, 0],
              fontFamily: 'Microsoft YaHei'
            },
          },
          nameTextStyle: {
            color: '#ebf8ac',
            fontSize: 16,
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: ['项目储备', '项目立项', '可研论证', '投资决策'],
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          axisTick: {
            show: true, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            textStyle: {
              color: '#fff', //X轴文字颜色
              fontSize: 20,
              padding: [-320, 0, 0, 0],
              fontFamily: 'Microsoft YaHei'
            },
          },
        },
        series: [
          {
            name: '',
            type: 'scatter',
            symbol: 'circle',
            symbolSize: function (data) {
              return Math.sqrt(data[2]) * 5;
            },
            // label: {
            //   emphasis: {
            //     show: true,
            //     formatter: function (param) {
            //       return param.data[2];
            //     },
            //     position: 'top'
            //   }
            // },
            itemStyle: {
              normal: {
                color: '#40A9FF'
              }
            },
            data: left14[0]
          },
          {
            name: '',
            type: 'scatter',
            symbol: 'circle',
            symbolSize: function (data) {
              return Math.sqrt(data[2]) * 5;
            },
            // label: {
            //   emphasis: {
            //     show: true,
            //     formatter: function (param) {
            //       return param.data[2];
            //     },
            //     position: 'top'
            //   }
            // },
            itemStyle: {
              normal: {
                color: '#957DFF'
              }
            },
            data: left14[1]
          },
        ]
      }
      let that = this
      that.left8Chart.on('click', function (param) {
        that.showChartLTipDouble(param.name, 'left', '项目阶段分析', '股权类进度分布', param.name, param.seriesName)
      })
      that.left8Chart.setOption(option)
      tools.loopShowTooltip(that.left8Chart, option, {
        nterval: 2000,
        loopSeries: true,
      })
    },
    // 大屏二
    initChartC1 () {
      var chartData = center2
      var timer = null;
      var i = 0;
      let that = this
      var option = {
        colors: ['#064F78', '#623726', '#955773', , '#B57C63', '#BDB35D', '#73A88E', '#09736D', '#13400B', '#0D3265'],
        chart: {
          type: 'pie',
          backgroundColor: 'rgba(0,0,0,0)',
          options3d: {
            enabled: true,
            alpha: 60,
            //beta: 0
          },
          events: {
            // load，图表加载完成时触发
            load: function () {
              var chart = this;

              var points = chart.series[0].points;
              var len = points.length;

              timer && clearInterval(timer);
              timer = setInterval(function () {
                autoTooltip(points[i]);
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                  if (index == i) {
                    item.sliced = true
                    item.selected = true
                  }
                })
                that.center1Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'distribution', e.point.options.typeno, 'industry', e.point.options.typeno, 1)
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                i++;
                if (i === len) {
                  i = 0;
                }
              }, 2000);
            },
            legendItemClick: function (event) {
              console.log(event);
              return true;
            }
          }
        },
        credits: {
          enabled: false  //去掉hightchats水印
        },
        legend: {
          layout: 'vertical',
          align: 'right',
          y: -10,
          verticalAlign: 'bottom',
          itemStyle: {
            fontSize: '20px',
            color: '#fff',
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          }
        },
        tooltip: {
          crosshairs: true,
          backgroundColor: 'rgba(0,0,0,0.5)',
          useHTML: false, //开启html模式
          style: {
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          formatter: function (e) {
            let num = chartData[this.colorIndex].num
            this.percentage = this.percentage.toFixed(2) //Math.round(this.percentage)
            return `${this.key}：<b>${this.percentage}%</b><br/>投资完成额：<b>${this.y}</b>亿<br/>投资数量：<b>${num}个</b>`
          },
          //pointFormat: 
        },
        plotOptions: {
          pie: {
            allowPointSelect: true,
            showInLegend: true, // 图例
            cursor: 'pointer',
            size: 500,
            // innerSize: 330, //环形图中间空白，0为饼图
            innerSize: 0, //环形图中间空白，0为饼图
            depth: 75, //立体高度
            slicedOffset: 40, //动画距离
            dataLabels: {
              enabled: false,  // 是否展示指示线
              format: '{point.name}: {point.percentage}'
            }
          },
        },
        title: {
          text: '',
          style: {
            color: '#fff',
            fontSize: 24,
            fontFamily: 'Microsoft YaHei'
          },
          align: 'center',
          verticalAlign: "bottom",
          x: -120
        },
        series: [{
          type: 'pie',
          name: '占比',
          center: ['74%', '50%'],
          point: {
            events: {
              click: function (e) { //点击事件
                that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'distribution', e.point.options.typeno, 'industry', e.point.options.typeno, 1)
              },
              mouseOver: function (e) { //鼠标移入停止轮播并且找到移入的当前数据设为选中
                //console.log(e) 
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                })
                chartData[e.target.index].sliced = true
                chartData[e.target.index].selected = true
                that.center1Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'distribution', e.point.options.typeno, 'industry', e.point.options.typeno, 1)
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                timer && clearInterval(timer);
              },
              mouseOut: function () { // 鼠标移出后需要继续执行轮播
                var points = that.center1Chart.series[0].points;
                var len = points.length;

                timer && clearInterval(timer);
                timer = setInterval(function () {
                  autoTooltip(points[i]);
                  chartData.forEach((item, index) => {
                    item.sliced = false
                    item.selected = false
                    if (index == i) {
                      item.sliced = true
                      item.selected = true
                    }
                  })
                  that.center1Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'distribution', e.point.options.typeno, industry, e.point.options.typeno, 1)
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                  i++;
                  if (i === len) {
                    i = 0;
                  }
                }, 2000);
              }
            }
          },
          data: chartData
        }]
      }

      that.center1Chart = Highcharts.chart('echartC1', option);

      function autoTooltip (point) {
        that.center1Chart.tooltip.refresh(point);
      }
    },
    initChartC2 () {
      let that = this
      that.center2Chart = echarts.init(this.$refs['echartC2'])
      that.center2Chart.on('showTip', (params) => {
        // 如果是7或者15并且满足防抖则切换
        if ((params.dataIndex == 5 || params.dataIndex == 11) && that.echartC2Fd) {
          that.echartC2Fd = false
          setTimeout(() => {
            option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6
            option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6
            that.center2Chart.setOption(option);
            // 防止勿刷新做的防抖
            setTimeout(() => {
              that.echartC2Fd = true
            }, 2000)
          }, 1900);
          // 如果是17表示到了最后一个，那么重新来一遍
        } else if (params.dataIndex == 17 && that.echartC2Fd) {
          that.echartC2Fd = false
          setTimeout(() => {
            option.dataZoom[0].endValue = 0
            option.dataZoom[0].startValue = 5
            that.center2Chart.setOption(option);
            // 防止勿刷新做的防抖
            setTimeout(() => {
              that.echartC2Fd = true
            }, 2000)
          }, 1900)
        }
      })
      let option = {
        tooltip: {
          formatter: data => {
            return `${data[0].name}<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[0].color.colorStops[0].color}"></span> ${data[0].seriesName}：${data[0].value}亿 <br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[1].color.colorStops[0].color}"></span> ${data[1].seriesName}：${data[1].value}亿`
          },
          trigger: 'axis',
          axisPointer: {
            // type: 'cross',',
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
        },
        dataZoom: [
          {
            // start: 9,//默认为@
            // end: 100,//黑认认为1@0
            type: "slider",
            show: false,
            // xAxisIndex: [0]
            handlesize: 0,//滑动条的 左右2个滑动条的大小
            startValue: 5,// 初始显示值
            endValue: 0,// 结束显示值
            height: 10,//组件高度
            left: "5%",
            right: "4%",//右边的距离
            bottom: "25%",//底边的距离
            borderColor: "#939",
            fillerColor: "#269cdb",
            borderRadius: 5,
            backgroundColor: "#33384b",//两边未选中的滑动条区域的额色
            showDataShadow: false,//是否显示数据阴影
            showDetail: false,//即拖拽时候是否显示详细数值信息 
            truerealtime: true,//是否实时更新
            filterMode: "filter"
          }, {
            type: 'inside',
            show: true,
            start: 1,
            end: 100,
            zoomOnMouseWheel: false,  //滚轮是否触发缩放
            moveOnMouseMove: false,  //鼠标滚轮触发滚动
          }
        ],
        grid: {
          top: '10%',
          right: '3%',
          left: '7%',
          bottom: '15%',
        },
        legend: {
          top: '1',
          right: 'center',
          textStyle: {
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: commonCompany,
          // data: center3.map(item => item.name),
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          axisTick: {
            show: false, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            rotate: 40,
            textStyle: {
              color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
        },
        yAxis: [
          {
            type: 'value',
            name: '亿',
            splitLine: {
              show: true,
              lineStyle: {
                color: '#68b4dd66',
                type: 'dashed',
              },
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: '#3D7495',
              },
            },
            axisLabel: {
              show: true,
              textStyle: {
                color: '#fff',
                fontSize: '20',
                fontFamily: 'Microsoft YaHei'
              },
            },
            nameTextStyle: {
              color: '#fff',
              fontSize: 20,
              fontFamily: 'Microsoft YaHei'
            },
          },
        ],
        series: [
          {
            name: '计划投资',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#69c0ff',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: center3.map(item => item.value),
          },
          {
            name: '实际投资',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#957DFF',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: center3.map(item => item.value2),
          },
        ],
      }
      that.center2Chart.on('click', function (param) {
        that.projectListTipShow = true
        that.centerPenetrateTwo('', '', that.findCode(param.name), param.seriesName == '计划投资' ? 2 : 1)
      })
      that.center2Chart.setOption(option)
      tools.loopShowTooltip(that.center2Chart, option, {
        nterval: 2000,
        loopSeries: true,
      })
      // let arr = center3.map(item => item.value2)
      // this.timeOut = setInterval(function () {

      //   let startValue = myChart.getModel().option.dataZoom[0].startValue;
      //   let endValue = myChart.getModel().option.dataZoom[0].endValue;
      //   let start = myChart.getModel().option.xAxis[0].data[startValue];//起始X轴
      //   let end = myChart.getModel().option.xAxis[0].data[endValue];//结束X轴
      //   // 每次向后滚动一个，最后一个从头开始。
      //   // console.log(option.dataZoom[0].endValue);

      //   if (option.dataZoom[0].endValue >= 12) {
      //     option.dataZoom[0].endValue = 5
      //     option.dataZoom[0].startValue = 0
      //   } else {
      //     option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6
      //     option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6
      //   }

      //   // myChart.dispatchAction({
      //   //   type: 'showTip',
      //   //   seriesIndex: 0,
      //   //   dataIndex: startValue +1,
      //   // });
      //   myChart.setOption(option);
      // }, 12000);

    },
    convertData (data) {
      var res = []
      for (var i = 0; i < data.length; i++) {
        var geoCoord = this.geoCoordMap[data[i].name]
        if (geoCoord) {
          res.push({
            name: data[i].name,
            value: geoCoord.concat(data[i].value),
          })
        }
      }
      return res
    },
    yuanChange (value) {
      return (value / 100000000).toFixed(2)
    },
    // 逢三折断
    numFormat (value) {
      if (!value) return '0'
      // var intPart = Number(value).toFixed(0) // 获取整数部分
      var intPart = parseInt(value)// 获取整数部分
      var intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,') // 将整数部分逢三一断

      var floatPart = '.00' // 预定义小数部分
      var value2Array = value.toString().split('.')
      // =2表示数据有小数位
      if (value2Array.length === 2) {
        floatPart = value2Array[1].toString() // 拿到小数部分
        if (floatPart.length === 1) {
          // 补0
          return intPartFormat + '.' + floatPart + '0'
        } else {
          return intPartFormat + '.' + floatPart
        }
      } else {
        return intPartFormat
      }
    },
    initProvinceChart () {
      var data = center5
      this.geoCoordMap = []
      /*获取地图数据*/
      this.mapChart = echarts.init(this.$refs['echarts-map'])
      echarts.registerMap('shanxi', shanxi)
      var mapFeatures = echarts.getMap('shanxi').geoJson.features
      mapFeatures.forEach(v => {
        // 地区名称
        var name = v.properties.name
        // 地区经纬度
        this.geoCoordMap[name] = v.properties.centroid
        // 按照地图乱序
        // data.push({ name: v.properties.name, value: v.properties.centroid[0], value2: v.properties.centroid[1] })
      })
      let option = {
        tooltip: {
          padding: 15,
          enterable: true,
          transitionDuration: 1,
          formatter: (params, ticket, callback) => {
            // 清空所有轮播
            for (var k in this.geoCoordMap) {
              this.mapChart.dispatchAction({
                // type: 'geoUnSelect',
                type: 'downplay',
                name: k,
              })
            }
            // 如果鼠标滑动到线线上面，则返回空
            this.mapChart.dispatchAction({
              // type: 'geoSelect',
              type: 'highlight',
              name: params.name,
            })
            if (params.componentSubType == 'lines') {
              return
            }
            if (params.componentSubType == 'scatter') {
              let tipHtml = `
              <div class="tooltip-cont">
                <p>项目数量：<span>${data[params.dataIndex].value2}个</span></p>
                <p>总投资额：<span>${params.data.value[2]}亿</span></p>
            </div>`
              callback(ticket, tipHtml)
              return tipHtml
            }
            if (params.componentSubType == 'map') {
              let tipHtml = `
              <div class="tooltip-cont">
              <p>项目数量：<span>${data[params.dataIndex].value2}个</span></p>
                <p>总投资额：<span>${params.data.value}亿</span></p>
            </div>`
              callback(ticket, tipHtml)
              return tipHtml
            }

          },
        },
        visualMap: {
          show: false,
          min: 0,
          max: 300,
          right: 0,
          bottom: 0,
          text: ['高', '低'],
          textStyle: {
            color: '#f1f1f1'
          },
          realtime: false,
          calculable: false,
          inRange: {
            color: ['lightskyblue', '#2754b7']
          }
        },
        geo: {
          show: true,
          map: 'shanxi',
          layoutCenter: ['50%', '50%'], //地图位置
          layoutSize: '140%',
          label: {
            normal: {
              position: [100, 100],
              fontSize: 25,
              fontFamily: 'Microsoft YaHei',
              fontWeight: 600,
              color: '#fff',
              show: true,
            },
            emphasis: {
              show: true,
              color: '#e7e1a0',
              fontSize: 30,
            },
          },
          roam: false,
          itemStyle: {
            normal: {
              areaColor: '#1946a8',
              shadowColor: '#1946a8',
              borderWidth: 2, //设置外层边框
              borderColor: '#1946a8',
              shadowOffsetX: 0,
              shadowOffsetY: 0,
              shadowBlur: 0,
            },
            emphasis: {
              areaColor: '#013d95',
              borderColor: '#e7e1a0',
              borderWidth: 4, //设置外层边框
            },
          },
        },
        series: [
          {
            type: 'map',
            map: 'shanxi',
            geoIndex: 0,
            aspectScale: 1.5, //长宽比
            data: data,
          },
        ],
      }
      let that = this
      this.mapChart.on('click', function (params) {
        if (params.name == '太原市') {
          that.showChartLTipDouble(params.name, 'center', '', '', '', '', 'investmentMap', '太原市', '山西省')
        }
      })
      tools.loopShowTooltip(this.mapChart, option, {
        interval: 2000,
        loopSeries: false,
      });
      this.mapChart.setOption(option)
    },
    initChinaChart () {
      var data = centerChina
      this.geoCoordMap = []
      /*获取地图数据*/
      this.mapChart = echarts.init(this.$refs['chinaMap'])
      echarts.registerMap('china', china)
      var mapFeatures = echarts.getMap('china').geoJson.features
      mapFeatures.forEach(v => {
        // 地区名称
        var name = v.properties.name
        // 地区经纬度
        this.geoCoordMap[name] = v.properties.cp
        data.push({ name: v.properties.name, value: v.properties.cp[0], value2: v.properties.cp[1] })
      })
      let option = {
        tooltip: {
          padding: 15,
          enterable: true,
          transitionDuration: 1,
          formatter: (params, ticket, callback) => {
            // 清空所有轮播
            this.mapChart.dispatchAction({
              // type: 'geoUnSelect',
              type: 'downplay',
              name: '南海诸岛',
            })
            for (var k in this.geoCoordMap) {
              this.mapChart.dispatchAction({
                // type: 'geoUnSelect',
                type: 'downplay',
                name: k,
              })
            }
            // 如果鼠标滑动到线线上面，则返回空
            this.mapChart.dispatchAction({
              // type: 'geoSelect',
              type: 'highlight',
              name: params.name,
            })
            if (params.componentSubType == 'lines') {
              return
            }
            if (params.componentSubType == 'scatter') {
              let tipHtml = `
              <div class="tooltip-cont">
                <p>项目数量：<span>${data[params.dataIndex].value2}个</span></p>
                <p>总投资额：<span>${params.data.value[2]}亿</span></p>
            </div>`
              callback(ticket, tipHtml)
              return tipHtml
            }
            if (params.componentSubType == 'map') {
              let tipHtml = `
              <div class="tooltip-cont">
              <p>项目数量：<span>${data[params.dataIndex].value2}个</span></p>
                <p>总投资额：<span>${params.data.value}亿</span></p>
            </div>`
              callback(ticket, tipHtml)
              return tipHtml
            }

          },
        },
        visualMap: {
          show: false,
          min: 0,
          max: 1000,
          left: '100',
          bottom: 100,
          text: ['高', '低'],
          textStyle: {
            color: '#f1f1f1'
          },
          realtime: true, //拖拽时，是否实时更新
          calculable: false,
          inRange: {
            color: ['lightskyblue', '#2754b7']
          },
          itemWidth: 50, //图形的宽度，即长条的宽度。
          itemHeight: 400, //图形的高度，即长条的高度。
          textStyle: {
            fontSize: 30,
            color: '#fff'
          }
        },
        geo: {
          show: true,
          map: 'china',
          layoutCenter: ['50%', '50%'], //地图位置
          layoutSize: '110%',
          label: {
            normal: {
              position: [100, 100],
              fontSize: 25,
              fontFamily: 'Microsoft YaHei',
              fontWeight: 600,
              color: '#fff',
              show: true,
            },
            emphasis: {
              show: true,
              color: '#e7e1a0',
              fontSize: 30,
            },
          },
          // 滑轮缩放
          roam: false,
          itemStyle: {
            normal: {
              areaColor: '#1946a8',
              shadowColor: '#1946a8',
              borderWidth: 2, //设置外层边框
              borderColor: '#0b245b',
              shadowOffsetX: 0,
              shadowOffsetY: 0,
              shadowBlur: 0,
            },
            emphasis: {
              areaColor: '#013d95',
              borderColor: '#e7e1a0',
              borderWidth: 4, //设置外层边框
            },
          },
        },
        series: [
          {
            type: 'map',
            map: 'china',
            geoIndex: 0,
            data: data,
          },
        ],
      }
      let that = this
      this.mapChart.on('click', function (params) {
        if (params.name == '山西') {
          // that.showChartLTipDouble(params.name, 'center', '', '', '', '', '', 'investmentMap', '山西省')
          that.mapChart.dispose()
          that.centerShow = true
          setTimeout(() => {
            that.initChartC1()
            that.initChartC2()
            that.initChartC3()
            that.initChartC4()
            if (that.versions) {
              that.centerPenetrateOne('investmentMap', params.name, 3, '', '')
            } else {
              that.initProvinceChart()
            }
            that.initProjectList()
          })
        }
      })
      tools.loopShowTooltip(this.mapChart, option, {
        interval: 2000,
        loopSeries: false,
      });
      this.mapChart.setOption(option)
    },
    initChartC3 () {
      this.center3Chart = echarts.init(this.$refs['echartC3'])
      let option = {
        tooltip: {
          trigger: 'axis',
          formatter: '{a0}：{c0}' + '亿',  //+ '<br/>'+ '{a1}：{c1}' + '%',
          axisPointer: {
            // type: 'cross',',
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
        },
        grid: {
          top: '8%',
          right: '3%',
          left: '7%',
          bottom: '10%',
        },
        // legend: {
        //   top: '1',
        //   textStyle: {
        //     color: 'rgba(250,250,250,0.6)',
        //   },
        // },
        xAxis: {
          data: center6.map(item => item.name),
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          axisTick: {
            show: false, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            rotate: 20,
            textStyle: {
              color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
        },
        yAxis: [
          {
            type: 'value',
            name: '亿',
            splitLine: {
              show: true,
              lineStyle: {
                color: '#68b4dd66',
                type: 'dashed',
              },
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: '#3D7495',
              },
            },
            axisLabel: {
              show: true,
              textStyle: {
                color: '#fff',
                fontSize: '20',
                fontFamily: 'Microsoft YaHei'
              },
            },
            nameTextStyle: {
              color: '#fff',
              fontSize: 20,
              fontFamily: 'Microsoft YaHei'
            },
          },
          {
            type: 'value',
            axisLine: {
              show: false,
            },
            splitLine: {
              show: false,
            },
            axisLabel: {
              show: true,
              formatter: '{value} %',
              textStyle: {
                color: 'rgba(250,250,250,0.6)',
              },
            },
          },
        ],
        series: [
          {
            type: 'bar',
            name: '投资金额',
            barWidth: 15,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#69c0ff',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: center6.map(item => item.value),
          },
        ],
      }
      let that = this
      that.center3Chart.on('click', function (param) {
        if (param.name == '煤炭和煤电') {
          that.showChartLTipSingle(param.name, 'center', 'keyIndicators', 'ceiamount', '', '', '', '', 'five', '1', 2)
        } else if (param.name == '煤电和新能源') {
          that.showChartLTipSingle(param.name, 'center', 'keyIndicators', 'cpneiamount', '', '', '', '', 'five', '2', 2)
        } else if (param.name == '煤炭和化工') {
          that.showChartLTipSingle(param.name, 'center', 'keyIndicators', 'ccheiamount', '', '', '', '', 'five', '3', 2)
        } else if (param.name == '煤炭和数字') {
          that.showChartLTipSingle(param.name, 'center', 'keyIndicators', 'cdiamount', '', '', '', '', 'five', '4', 2)
        } else if (param.name == '煤炭和降炭') {
          that.showChartLTipSingle(param.name, 'center', 'keyIndicators', 'cciamount', '', '', '', '', 'five', '5', 2)
        }
      })
      that.center3Chart.setOption(option)
      tools.loopShowTooltip(that.center3Chart, option, {
        nterval: 2000,
        loopSeries: true,
      })

    },
    initChartC4 () {
      var chartData = []
      var timer = null;
      var timer2 = null;
      var i = 0;
      center7.forEach((item, index) => {
        let obj = {
          name: item.name,
          y: item.value2,
          num: item.value,
          typeno: item.typeno,
          sliced: false,
          selected: false,
          color: index == 0 ? '#064F78' : '#623726'
        }
        chartData.push(obj)
      })
      let that = this
      that.center4Chart = Highcharts.chart('echartC4', {
        chart: {
          type: 'pie',
          backgroundColor: 'rgba(0,0,0,0)',
          options3d: {
            enabled: true,
            alpha: 60,
            //beta: 0
          },
          events: {
            // load，图表加载完成时触发
            load: function () {
              var chart = this;

              var points = chart.series[0].points;
              var len = points.length;

              timer && clearInterval(timer);
              timer = setInterval(function () {
                autoTooltip(points[i]);
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                  if (index == i) {
                    item.sliced = true
                    item.selected = true
                  }
                })
                that.center4Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'keyIndicators', e.point.options.typeno, 'state', e.point.name == '新建' ? 'new' : 'renew', 1)
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                i++;
                if (i === len) {
                  i = 0;
                  chartData.forEach((item, index) => {
                    item.sliced = false
                    item.selected = false
                  })
                  that.center4Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'keyIndicators', e.point.options.typeno, 'state', e.point.name == '新建' ? 'new' : 'renew', 1)
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                }
              }, 2000);
            },
            legendItemClick: function (event) {
              console.log(event);
              return true;
            }
          }
        },
        credits: {
          enabled: false  //去掉hightchats水印
        },
        title: {
          text: null
        },
        tooltip: {
          crosshairs: true,
          backgroundColor: 'rgba(0,0,0,0.5)',
          // positioner: function(e){
          //   console.log(e, this)
          // },
          useHTML: false, //开启html模式
          style: {
            color: '#fff',
            fontSize: '20',
            fontFamily: 'Microsoft YaHei'
          },
          formatter: function (e) {
            //console.log(this)
            let num = chartData[this.colorIndex].num
            this.percentage = Math.round(this.percentage)
            return `${this.key}：<b>${this.percentage}%</b><br/>投资完成额：<b>${this.y}</b>亿<br/>投资数量：<b>${num}个</b>`
          },
          //pointFormat: 
        },
        legend: {
          layout: 'vertical',
          align: 'right',
          y: -10,
          verticalAlign: 'bottom',
          itemStyle: {
            fontSize: '20px',
            color: '#fff',
            fontWeight: 0,
            fontFamily: 'Microsoft YaHei'
          }
        },
        plotOptions: {
          pie: {
            allowPointSelect: true,
            showInLegend: true, // 图例
            cursor: 'pointer',
            size: 500,
            // innerSize: 330, //环形图中间空白，0为饼图
            innerSize: 0, //环形图中间空白，0为饼图
            depth: 75, //立体高度
            slicedOffset: 40, //动画距离
            dataLabels: {
              enabled: false,  // 是否展示指示线
              format: '{point.name}: {point.percentage}'
            }
          },
        },
        series: [{
          type: 'pie',
          name: '占比',
          center: ['60%', '50%'],
          y: -10,
          point: {
            events: {
              click: function (e) { //点击事件
                that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'keyIndicators', e.point.options.typeno, 'state', e.point.name == '新建' ? 'new' : 'renew', 1)
              },
              mouseOver: function (e) { //鼠标移入停止轮播并且找到移入的当前数据设为选中
                //console.log(e) 
                chartData.forEach((item, index) => {
                  item.sliced = false
                  item.selected = false
                })
                chartData[e.target.index].sliced = true
                chartData[e.target.index].selected = true
                that.center4Chart.update({
                  series: [{
                    type: 'pie',
                    name: '占比',
                    point: {
                      events: {
                        click: function (e) {
                          that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'keyIndicators', e.point.options.typeno, 'state', e.point.name == '新建' ? 'new' : 'renew', 1)
                        }
                      }
                    },
                    data: chartData
                  }]
                })
                timer && clearInterval(timer);
              },
              mouseOut: function () { // 鼠标移出后需要继续执行轮播
                var points = that.center4Chart.series[0].points;
                var len = points.length;

                timer && clearInterval(timer);
                timer = setInterval(function () {
                  autoTooltip(points[i]);
                  chartData.forEach((item, index) => {
                    item.sliced = false
                    item.selected = false
                    if (index == i) {
                      item.sliced = true
                      item.selected = true
                    }
                  })
                  that.center4Chart.update({
                    series: [{
                      type: 'pie',
                      name: '占比',
                      point: {
                        events: {
                          click: function (e) {
                            that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'keyIndicators', e.point.options.typeno, 'state', e.point.name == '新建' ? 'new' : 'renew', 1)
                          }
                        }
                      },
                      data: chartData
                    }]
                  })
                  i++;
                  if (i === len) {
                    i = 0;
                    chartData.forEach((item, index) => {
                      item.sliced = false
                      item.selected = false
                    })
                    that.center4Chart.update({
                      series: [{
                        type: 'pie',
                        name: '占比',
                        point: {
                          events: {
                            click: function (e) {
                              that.showChartLTipDouble(e.point.name, 'center', '', '', '', '', 'keyIndicators', e.point.options.typeno, 'state', e.point.name == '新建' ? 'new' : 'renew', 1)
                            }
                          }
                        },
                        data: chartData
                      }]
                    })
                  }
                }, 2000);
              }
            }
          },
          data: chartData
        }]
      });

      function autoTooltip (point) {
        that.center4Chart.tooltip.refresh(point);
      }
    },
    initProjectList () {
      let dataList = []
      center8.map(item => {
        if (this.versions) {
          dataList.push([item.office, item.name, this.yuanChange(item.value) + '亿', item.typeno])
        } else {
          dataList.push([item.office, item.name, item.value + '亿'])
        }
      })

      this.storageRecordConfig2.data = dataList
      this.storageRecordConfig2 = { ...this.storageRecordConfig2 }
    },
    // 大屏三
    initChartR1 () {
      let that = this
      that.right1Chart = echarts.init(this.$refs['echartR1'])
      that.right1Chart.on('showTip', (params) => {
        // 如果是7或者15并且满足防抖则切换
        if ((params.dataIndex == 5 || params.dataIndex == 11) && that.echartR1Fd) {
          that.echartR1Fd = false
          setTimeout(() => {
            option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6
            option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6
            that.right1Chart.setOption(option);
            // 防止勿刷新做的防抖
            setTimeout(() => {
              that.echartR1Fd = true
            }, 2000)
          }, 1900);
          // 如果是17表示到了最后一个，那么重新来一遍
        } else if (params.dataIndex == 17 && that.echartR1Fd) {
          that.echartR1Fd = false
          setTimeout(() => {
            option.dataZoom[0].endValue = 0
            option.dataZoom[0].startValue = 5
            that.right1Chart.setOption(option);
            // 防止勿刷新做的防抖
            setTimeout(() => {
              that.echartR1Fd = true
            }, 2000)
          }, 1900)
        }
      })
      let option = {
        tooltip: {
          formatter: data => {
            return `${data[0].name}<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[0].color.colorStops[0].color}"></span> ${data[0].seriesName}：${data[0].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[1].color.colorStops[0].color}"></span> ${data[1].seriesName}：${data[1].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[2].color.colorStops[0].color}"></span> ${data[2].seriesName}：${data[2].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[3].color.colorStops[0].color}"></span> ${data[3].seriesName}：${data[3].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[4].color.colorStops[0].color}"></span> ${data[4].seriesName}：${data[4].value}亿`
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
          trigger: 'axis',
          axisPointer: {
            // type: 'cross',',
          },
        },
        dataZoom: [
          {
            // start: 9,//默认为@
            // end: 100,//黑认认为1@0
            type: "slider",
            show: false,
            // xAxisIndex: [0]
            handlesize: 0,//滑动条的 左右2个滑动条的大小
            startValue: 5,// 初始显示值
            endValue: 0,// 结束显示值
            height: 10,//组件高度
            left: "5%",
            right: "4%",//右边的距离
            bottom: "25%",//底边的距离
            borderColor: "#939",
            fillerColor: "#269cdb",
            borderRadius: 5,
            backgroundColor: "#33384b",//两边未选中的滑动条区域的额色
            showDataShadow: false,//是否显示数据阴影
            showDetail: false,//即拖拽时候是否显示详细数值信息 
            truerealtime: true,//是否实时更新
            filterMode: "filter"
          }, {
            type: 'inside',
            show: true,
            start: 1,
            end: 100,
            zoomOnMouseWheel: false,  //滚轮是否触发缩放
            moveOnMouseMove: false,  //鼠标滚轮触发滚动
          }
        ],
        grid: {
          top: '10%',
          right: '3%',
          left: '5%',
          bottom: '5%',
        },
        legend: {
          data: ["预算额", "已签合同额", '产值认定额', '结算额', '付款额'],
          x: 'center',
          y: '0px',
          textStyle: {
            color: '#fff',
            fontSize: "20",
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: commonCompany,
          // data: right4.map(item => item.name),
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          axisTick: {
            show: false, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            // rotate: 40,
            textStyle: {
              color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
              fontSize: "20",
              fontFamily: 'Microsoft YaHei'
            },
          },
        },
        yAxis: [
          {
            type: 'value',
            name: '亿',
            nameTextStyle: {
              color: 'rgba(255,255,255,0.6)',
            },
            splitLine: {
              show: true,
              lineStyle: {
                color: '#68b4dd66',
                type: 'dashed',
              },
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: '#3D7495',
              },
            },
            axisLabel: {
              show: true,
              textStyle: {
                color: '#fff',
                fontSize: "20",
                fontFamily: 'Microsoft YaHei'
              },
            },
            nameTextStyle: {
              color: '#fff',
              fontSize: 20,
              fontFamily: 'Microsoft YaHei'
            },
          },
        ],
        series: [
          {
            name: '预算额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#064F78',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right4.map(item => item.value),
          },
          {
            name: '已签合同额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#623726',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right4.map(item => item.value2),
          },
          {
            name: '产值认定额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#955773',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right4.map(item => item.value3),
          },
          {
            name: '结算额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#B57C63',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right4.map(item => item.value4),
          },
          {
            name: '付款额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#BDB35D',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right4.map(item => item.value5),
          },
        ],
      }
      that.right1Chart.on('click', function (param) {
        if (that.versions) {
          that.rightPenetrateTwo(2, '', that.findCode(param.name), 'right')
        } else {
          that.projectListTipShow = true
        }
      })
      that.right1Chart.setOption(option)
      tools.loopShowTooltip(that.right1Chart, option, {
        interval: 2000,
        loopSeries: true,
      })
    },
    initChartR2 () {
      let that = this
      const itemStyle = {
        // opacity: 0.8,
        shadowBlur: 10,
        shadowOffsetX: 0,
        shadowOffsetY: 0,
        shadowColor: 'rgba(0,0,0,0.3)'
      };
      that.right2Chart = echarts.init(this.$refs['echartR2'])
      that.right2Chart.on('showTip', (params) => {
        // 如果是7或者15并且满足防抖则切换
        if ((params.dataIndex == 5 || params.dataIndex == 11) && that.echartR2Fd) {
          that.echartR2Fd = false
          setTimeout(() => {
            option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6
            option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6
            that.right2Chart.setOption(option);
            // 防止勿刷新做的防抖
            setTimeout(() => {
              that.echartR2Fd = true
            }, 2000)
          }, 1900);
          // 如果是17表示到了最后一个，那么重新来一遍
        } else if (params.dataIndex == 17 && that.echartR2Fd) {
          that.echartR2Fd = false
          setTimeout(() => {
            option.dataZoom[0].endValue = 0
            option.dataZoom[0].startValue = 5
            that.right2Chart.setOption(option);
            // 防止勿刷新做的防抖
            setTimeout(() => {
              that.echartR2Fd = true
            }, 2000)
          }, 1900)
        }
      })
      let option = {
        color: ['#04635E', '#697143', '#4A3042'],
        dataZoom: [
          {
            // start: 9,//默认为@
            // end: 100,//黑认认为1@0
            type: "slider",
            show: false,
            // xAxisIndex: [0]
            handlesize: 0,//滑动条的 左右2个滑动条的大小
            startValue: 5,// 初始显示值
            endValue: 0,// 结束显示值
            height: 10,//组件高度
            left: "5%",
            right: "4%",//右边的距离
            bottom: "25%",//底边的距离
            borderColor: "#939",
            fillerColor: "#269cdb",
            borderRadius: 5,
            backgroundColor: "#33384b",//两边未选中的滑动条区域的额色
            showDataShadow: false,//是否显示数据阴影
            showDetail: false,//即拖拽时候是否显示详细数值信息 
            truerealtime: true,//是否实时更新
            filterMode: "filter"
          }, {
            type: 'inside',
            show: true,
            start: 1,
            end: 100,
            zoomOnMouseWheel: false,  //滚轮是否触发缩放
            moveOnMouseMove: false,  //鼠标滚轮触发滚动
          }
        ],
        legend: {
          top: 10,
          data: ['正偏差', '容差', '负偏差'],
          textStyle: {
            fontSize: 20,
            color: '#fff',
            fontFamily: 'Microsoft YaHei'
          }
        },
        textStyle: {
          color: '#fff',
        },
        tooltip: {
          show: true,
          trigger: "axis",
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
          formatter: data => {
            return `${data[0].value[0]}<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[0].color}"></span> ${data[0].seriesName}：${data[0].data[2]}%<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[1].color}"></span> ${data[1].seriesName}：${data[1].data[2]}%<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[2].color}"></span> ${data[2].seriesName}：${data[2].data[2]}%`
          },
          axisPointer: {
            //  // type: 'cross',',
          },
        },
        grid: {
          top: '10%',
          right: '4%',
          left: '5%',
          bottom: '5%',
        },
        yAxis: {
          name: '',
          splitLine: {
            show: true,
            lineStyle: {
              color: '#68b4dd66',
              type: 'dashed',
            },
          },
          axisLine: {
            show: false
          },
          axisLabel: {
            show: true,
            formatter: '{value}%',
            textStyle: {
              color: '#fff',
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
          nameTextStyle: {
            color: '#fff',
            fontSize: 20,
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: commonCompany,
          // data: right5[0].map(item => item[0]),
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: '#68b4dd66',
              type: 'dashed',
            },
          },
          axisTick: {
            show: false, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            // rotate: 40,
            padding: [0, 0, 0, 0],
            textStyle: {
              color: '#fff', //X轴文字颜色
              fontSize: 20,
              fontFamily: 'Microsoft YaHei'
            },
          },
        },
        series: [
          {
            name: '正偏差',
            type: 'scatter',
            itemStyle: itemStyle,
            data: right5[0],
            symbolSize: function (data) {
              return Math.sqrt(Math.abs(data[2])) * 9;
            },
          },
          {
            name: '容差',
            type: 'scatter',
            itemStyle: itemStyle,
            data: right5[1],
            symbolSize: function (data) {
              return Math.sqrt(Math.abs(data[2])) * 9;
            },
          },
          {
            name: '负偏差',
            type: 'scatter',
            itemStyle: itemStyle,
            data: right5[2],
            symbolSize: function (data) {
              return Math.sqrt(Math.abs(data[2])) * 9;
            },
          }
        ]
      }
      that.right2Chart.on('click', function (param) {
        if (that.versions) {
          that.rightPenetrateTwo(1, param.seriesName == '正偏差' ? 1 : param.seriesName == '容差' ? 2 : 3, that.findCode(param.name), 'right')
        } else {
          that.projectListTipShow = true
        }
      })
      that.right2Chart.setOption(option)
      tools.loopShowTooltip(that.right2Chart, option, {
        interval: 2000,
        loopSeries: true,
      })
    },
    initChartR3 () {
      let that = this
      that.right3Chart = echarts.init(this.$refs['echartR3'])
      that.right3Chart.on('showTip', (params) => {
        this.echartR4Chart ? this.echartR4Chart.dispose() : ''
        this.echartR5Chart ? this.echartR5Chart.dispose() : ''
        that.initChartR4(params.dataIndex)
        that.initChartR5(params.dataIndex)
        // 如果是7或者15并且满足防抖则切换
        if ((params.dataIndex == 5 || params.dataIndex == 11) && that.echartR3Fd) {
          that.echartR3Fd = false
          setTimeout(() => {
            option.dataZoom[0].endValue = option.dataZoom[0].endValue + 6
            option.dataZoom[0].startValue = option.dataZoom[0].startValue + 6
            that.right3Chart.setOption(option);
            // 防止勿刷新做的防抖
            setTimeout(() => {
              that.echartR3Fd = true
            }, 2000)
          }, 7900);
          // 如果是17表示到了最后一个，那么重新来一遍
        } else if (params.dataIndex == 17 && that.echartR3Fd) {
          that.echartR3Fd = false
          setTimeout(() => {
            option.dataZoom[0].endValue = 0
            option.dataZoom[0].startValue = 5
            that.right3Chart.setOption(option);
            // 防止勿刷新做的防抖
            setTimeout(() => {
              that.echartR3Fd = true
            }, 2000)
          }, 7900)
        }
      })
      let option = {
        tooltip: {
          formatter: data => {
            return `${data[0].name}<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[0].color.colorStops[0].color}"></span> ${data[0].seriesName}：${data[0].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[1].color.colorStops[0].color}"></span> ${data[1].seriesName}：${data[1].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[2].color.colorStops[0].color}"></span> ${data[2].seriesName}：${data[2].value}亿`
          },
          trigger: 'axis',
          axisPointer: {
            // type: 'cross',',
          },
          position: (params) => {
            return [params[0] + 10, 60]
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
          confine: true
        },
        dataZoom: [
          {
            // start: 9,//默认为@
            // end: 100,//黑认认为1@0
            type: "slider",
            show: false,
            // xAxisIndex: [0]
            handlesize: 0,//滑动条的 左右2个滑动条的大小
            startValue: 5,// 初始显示值
            endValue: 0,// 结束显示值
            height: 10,//组件高度
            left: "5%",
            right: "4%",//右边的距离
            bottom: "25%",//底边的距离
            borderColor: "#939",
            fillerColor: "#269cdb",
            borderRadius: 5,
            backgroundColor: "#33384b",//两边未选中的滑动条区域的额色
            showDataShadow: false,//是否显示数据阴影
            showDetail: false,//即拖拽时候是否显示详细数值信息 
            truerealtime: true,//是否实时更新
            filterMode: "filter"
          }, {
            type: 'inside',
            show: true,
            start: 1,
            end: 100,
            zoomOnMouseWheel: false,  //滚轮是否触发缩放
            moveOnMouseMove: false,  //鼠标滚轮触发滚动
          }
        ],
        grid: {
          top: '25%',
          right: '3%',
          left: '10%',
          bottom: '20%',
        },
        legend: {
          data: ["低风险", "中风险", '高风险'],
          x: 'center',
          y: '15px',
          textStyle: {
            // color: 'rgba(250,250,250,0.6)',
            color: '#fff',
            fontSize: "20",
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: commonCompany,
          // data: right4.map(item => item.name),
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          axisTick: {
            show: false, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            rotate: 40,
            textStyle: {
              color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            },
          },
        },
        yAxis: [
          {
            type: 'value',
            name: '亿',
            nameTextStyle: {
              color: 'rgba(255,255,255,0.6)',
            },
            splitLine: {
              show: true,
              lineStyle: {
                color: '#68b4dd66',
                type: 'dashed',
              },
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: '#3D7495',
              },
            },
            axisLabel: {
              show: true,
              textStyle: {
                color: '#fff',
                fontSize: '20',
                fontFamily: 'Microsoft YaHei'
              },
            },
            nameTextStyle: {
              color: '#fff',
              fontSize: 20,
              fontFamily: 'Microsoft YaHei'
            },
          },
        ],
        series: [
          {
            name: '高风险',
            type: 'bar',
            stack: 'Ad',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#4A3042',
                  },
                  {
                    offset: 1,
                    color: '#4A3042',
                  },
                ]),
              },
            },
            data: right6.map(item => item.value),
          },
          {
            name: '中风险',
            type: 'bar',
            stack: 'Ad',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#697143',
                  },
                  {
                    offset: 1,
                    color: '#697143',
                  },
                ]),
              },
            },
            data: right6.map(item => item.value2),
          },
          {
            name: '低风险',
            type: 'bar',
            stack: 'Ad',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#04635E',
                  },
                  {
                    offset: 1,
                    color: '#04635E',
                  },
                ]),
              },
            },
            data: right6.map(item => item.value3),
          },
        ],
      }
      that.right3Chart.on('click', function (param) {
        if (that.versions) {
          that.rightPenetrateTwo('', '', that.findCode(param.name), 'right')
        } else {
          that.projectListTipShow = true
        }
      })
      that.right3Chart.setOption(option)
      tools.loopShowTooltip(that.right3Chart, option, {
        interval: 8000,
        loopSeries: true,
      })
    },
    initChartR4 (indexValue) {
      this.echartR4Chart = echarts.init(this.$refs['echartR4'])
      option = {
        title: {
          text: ''
        },
        radar: {
          center: ['50%', '50%'],
          radius: 135,
          indicator: [
            { name: '安全风险', max: 100000 },
            { name: '付款风险', max: 100000 },
            { name: '合同风险', max: 100000 },
            { name: '结算风险', max: 100000 },
            { name: '进度风险', max: 100000 },
            { name: '质量风险', max: 100000 },
          ],
          axisLine: {  // 设置雷达图中间射线的颜色
            lineStyle: {
              color: '#887d33',
            },
          },
          splitLine: { //网格颜色设置
            show: true,
            lineStyle: {
              width: 1,
              color: ['#871b1a', '#638f41', '#d29e35', '#b6802b']
            },
          },
          name: { //修改indicator文字的颜色
            textStyle: {
              color: "#fff",
              fontSize: '20',
              fontFamily: 'Microsoft YaHei'
            }
          },
          splitNumber: 4, //有几个圈
          splitArea: {  //设置图表颜色，show的值为true
            show: true,
            areaStyle: {
              // color:"#c1ddf8", //一般设置方式
              //设置渐变背景色 new echarts.graphic.LinearGradient(a,b,c,d,arr)
              //a ,b,c,d值可为0，1 a:1表示arr中的颜色右到左；c:1 arr中的颜色左到右
              //b:1表示arr中的颜色下到上；d:1表示arr中的颜色上到下
              // color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
              //   { offset: 0, color: '#887D33' }, // 0% 处的颜色 
              //   { offset: 0.75, color: '#7D4216' }, // 0% 处的颜色 
              //   { offset: 1, color: '#430705' }// 100% 处的颜色
              // ], false)
              color: ['#638f41', '#887d33', '#7d4216', '#430705'],
            }
          }
        },
        series: [
          {
            name: '',
            type: 'radar',
            symbol: 'circle', // 单个数值点的样式，还可以取值'rect','angle'等
            symbolSize: 0, // 数值点的大小
            data: [
              {
                value: right7[indexValue],
                name: '安全风险',
                itemStyle: { //该数值区域样式设置
                  normal: {
                    color: 'rgb(44,198,255,0.8)', //背景颜色，还需设置areaStyle
                    lineStyle: {
                      color: 'rgb(44,198,255,0.8)', //边框颜色
                    },
                  },
                },
                label: {  //显示value中具体的数值
                  normal: {
                    show: false,
                    textStyle: {  //更改数值样式
                      color: '#43EDE3'
                    }
                  },
                },
                areaStyle: { //设置区域背景颜色透明度
                  normal: {
                    width: 1,
                    opacity: 0.8,
                  },
                },
              }
            ]
          }
        ]
      };
      // tools.loopShowTooltip(myChart, option, {
      //   interval: 2000,
      //   loopSeries: true,
      // });
      this.echartR4Chart.setOption(option)
    },
    initChartR5 () {
      this.echartR5Chart = echarts.init(this.$refs['echartR5'])
      let option = {
        tooltip: {
          formatter: data => {
            return `${data[0].name}<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[0].color.colorStops[0].color}"></span> ${data[0].seriesName}：${data[0].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[1].color.colorStops[0].color}"></span> ${data[1].seriesName}：${data[1].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[2].color.colorStops[0].color}"></span> ${data[2].seriesName}：${data[2].value}亿<br/><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[3].color.colorStops[0].color}"></span> ${data[3].seriesName}：${data[3].value}亿`
          },
          trigger: 'axis',
          axisPointer: {
            // type: 'cross',',
          },
          textStyle: {
            color: '#FFF',     // 文字的颜色
            fontSize: '20',    // 文字字体大小
            fontFamily: 'Microsoft YaHei'
          },
        },
        grid: {
          top: '15%',
          right: '3%',
          left: '5%',
          bottom: '35',
        },
        legend: {
          data: ["预算额", "合同额", "结算额", "支付额"],
          x: 'center',
          y: '10px',
          textStyle: {
            // color: 'rgba(250,250,250,0.6)',
            color: '#fff',
            fontSize: "20",
            fontFamily: 'Microsoft YaHei'
          },
        },
        xAxis: {
          data: ['设备费', '设计费', '施工费', '材料费'],
          axisLine: {
            show: true, //隐藏X轴轴线
            lineStyle: {
              color: '#005094',
              width: 1,
            },
          },
          axisTick: {
            show: false, //隐藏X轴刻度
          },
          axisLabel: {
            show: true,
            // rotate: 40,
            textStyle: {
              color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
              fontSize: '20',    // 文字字体大小
              fontFamily: 'Microsoft YaHei'
            },
          },
        },
        yAxis: [
          {
            type: 'value',
            name: '亿',
            nameTextStyle: {
              color: 'rgba(255,255,255,0.6)',
            },
            splitLine: {
              show: true,
              lineStyle: {
                color: '#68b4dd66',
                type: 'dashed',
              },
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: '#3D7495',
              },
            },
            axisLabel: {
              show: true,
              textStyle: {
                color: '#fff',
                fontSize: '20',    // 文字字体大小
                fontFamily: 'Microsoft YaHei'
              },
            },
            nameTextStyle: {
              color: '#fff',
              fontSize: 20,
              fontFamily: 'Microsoft YaHei'
            },
          },
        ],
        series: [
          {
            name: '预算额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#a79c57',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right8.map(item => item.value),
          },
          {
            name: '合同额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#cc8c29',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right8.map(item => item.value2),
          },
          {
            name: '结算额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#034a39',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right8.map(item => item.value3),
          },
          {
            name: '支付额',
            type: 'bar',
            barWidth: 10,
            itemStyle: {
              normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#383062',
                  },
                  {
                    offset: 1,
                    color: '#082550',
                  },
                ]),
              },
            },
            data: right8.map(item => item.value4),
          },
        ],
      }
      this.echartR5Chart.setOption(option)
      tools.loopShowTooltip(this.echartR5Chart, option, {
        interval: 2000,
        loopSeries: true,
      })
    },
  },
})