地图样式

investmentNew/js/index.js

@@ -1,6 +1,6 @@
 let app = new Vue({
   el: "#app",
-  data() {
+  data () {
     return {
       leftEcharts1: "",
       leftEcharts2: "",
@@ -231,11 +231,11 @@ let app = new Vue({
       topIndex: 0,
     };
   },
-  created() {},
-  beforeDestroy() {
+  created () { },
+  beforeDestroy () {
     clearInterval(this.timer);
   },
-  mounted() {
+  mounted () {
     this.time4s();
     this.timeNs();
     this.filterLpData();
@@ -786,7 +786,7 @@ let app = new Vue({
       };
       that.right1Chart.setOption(option);
     },
-    initChartR3() {
+    initChartR3 () {
       let that = this;
       that.right3Chart = echarts.init(this.$refs["echartR3"]);
       let option = {
@@ -842,7 +842,7 @@ let app = new Vue({
       };
       that.right3Chart.setOption(option);
     },
-    initChartR4() {
+    initChartR4 () {
       let that = this;
       that.right4Chart = echarts.init(this.$refs["echartR4"]);
       let option = {
@@ -1019,7 +1019,7 @@ let app = new Vue({
       }
     },
     // 4秒定时器
-    time4s() {
+    time4s () {
       let that = this;
       // 4秒定时器
       this.time1 = setInterval(() => {
@@ -1037,7 +1037,7 @@ let app = new Vue({
       }, 4000);
     },
     // 针对投前产业布局分析的定时器
-    timeNs() {
+    timeNs () {
       let that = this;
       this.time2 = setInterval(() => {
         if (that.industryLayout < 3) {
@@ -1052,7 +1052,7 @@ let app = new Vue({
       }, left1[that.industryLayout].length * 2000);
     },
     // 主辅业占比点击方法
-    industryProportionChange(e) {
+    industryProportionChange (e) {
       let that = this;
       this.industryProportion = e;
       this.time1 && clearInterval(this.time1);
@@ -1067,14 +1067,14 @@ let app = new Vue({
       this.time4s();
     },
     // 产业布局分析点击方法
-    industryLayoutChange(e) {
+    industryLayoutChange (e) {
       this.industryLayout = e;
     },
-    yuanChange(value) {
+    yuanChange (value) {
       return Number((value / 100000000).toFixed(2));
     },
     // 逢三折断
-    numFormat(value) {
+    numFormat (value) {
       if (!value) return "0";
       // var intPart = Number(value).toFixed(0) // 获取整数部分
       var intPart = parseInt(value); // 获取整数部分
@@ -1098,7 +1098,7 @@ let app = new Vue({
         return intPartFormat;
       }
     },
-    leftEcharts1Fun() {
+    leftEcharts1Fun () {
       let that = this;
       this.leftEcharts1 = echarts.init(this.$refs["leftEcharts1"]);
       option = {
@@ -1161,7 +1161,7 @@ let app = new Vue({
       //注册
       that.leftEcharts1.setOption(option);
     },
-    leftEcharts2Fun() {
+    leftEcharts2Fun () {
       let that = this;
       this.leftEcharts2 = echarts.init(this.$refs["leftEcharts2"]);
       let nameList = ["a"];
@@ -1375,7 +1375,7 @@ let app = new Vue({
       //注册
       that.leftEcharts2.setOption(option);
     },
-    leftEcharts3Fun() {
+    leftEcharts3Fun () {
       let that = this;
       this.leftEcharts3 = echarts.init(this.$refs["leftEcharts3"]);
       option = {
@@ -1438,7 +1438,7 @@ let app = new Vue({
       //注册
       that.leftEcharts3.setOption(option);
     },
-    leftEcharts4Fun() {
+    leftEcharts4Fun () {
       let that = this;
       this.leftEcharts4 = echarts.init(this.$refs["leftEcharts4"]);
       let nameList = ["a"];
@@ -1652,7 +1652,7 @@ let app = new Vue({
       //注册
       that.leftEcharts4.setOption(option);
     },
-    leftEcharts5Fun() {
+    leftEcharts5Fun () {
       let that = this;
       this.leftEcharts5 = echarts.init(this.$refs["leftEcharts5"]);
       let dataList = [];
@@ -1682,11 +1682,9 @@ let app = new Vue({
         tooltip: {
           trigger: "item",
           formatter: function (e) {
-            return `<span style="display:inline-block;margin-right:15px;border-radius:10px;width:20px;height:20px;background-color:${
-              e.borderColor
-            };"></span>${e.name} ${e.percent}%<br>${e.value}亿 ${
-              left1[that.industryLayout][e.seriesIndex].num
-            }个`;
+            return `<span style="display:inline-block;margin-right:15px;border-radius:10px;width:20px;height:20px;background-color:${e.borderColor
+              };"></span>${e.name} ${e.percent}%<br>${e.value}亿 ${left1[that.industryLayout][e.seriesIndex].num
+              }个`;
           },
           backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
           textStyle: {
@@ -1774,7 +1772,7 @@ let app = new Vue({
       //注册
       that.leftEcharts5.setOption(option);
     },
-    leftEcharts6Fun() {
+    leftEcharts6Fun () {
       let that = this;
       this.leftEcharts6 = echarts.init(this.$refs["leftEcharts6"]);
       var dataArr = 44;
@@ -2054,7 +2052,7 @@ let app = new Vue({
       //注册
       that.leftEcharts6.setOption(option);
     },
-    leftEcharts7Fun() {
+    leftEcharts7Fun () {
       let that = this;
       this.leftEcharts7 = echarts.init(this.$refs["leftEcharts7"]);
       let option = {
@@ -2229,7 +2227,7 @@ let app = new Vue({
       //注册
       that.leftEcharts7.setOption(option);
     },
-    leftEcharts8Fun() {
+    leftEcharts8Fun () {
       let that = this;
       this.leftEcharts8 = echarts.init(this.$refs["leftEcharts8"]);
       let option = {
@@ -2537,6 +2535,7 @@ let app = new Vue({
             .slice(0, 6)
         ),
       ];
+      console.log(convertedData[0], '看看啥情况')
       data.sort(function (a, b) {
         return a.value - b.value;
       });
@@ -2556,61 +2555,90 @@ let app = new Vue({
               show: false,
             },
           },
+          roam: false,
+          itemStyle: {
+            normal: {
+              borderColor: '#7fb3ff',
+              borderWidth: 3,
+              areaColor: {
+                type: 'radial',
+                x: 0.5,
+                y: 0.5,
+                r: 0.8,
+                colorStops: [{
+                  offset: 0,
+                  color: '#468ff8' // 0% 处的颜色
+                }, {
+                  offset: 1,
+                  color: '#0a2c6d' // 100% 处的颜色
+                }],
+                globalCoord: false // 缺省为 false
+              },
+              // shadowColor: 'rgba(128, 217, 248, 1)',
+              shadowColor: '#468ff8',
+              shadowOffsetX: -2,
+              shadowOffsetY: 2,
+              shadowBlur: 20
+            },
+            emphasis: {
+              areaColor: {
+                colorStops: [{
+                  offset: 0,
+                  color: '#3844aa' // 0% 处的颜色
+                }, {
+                  offset: 1,
+                  color: '#7284fc' // 100% 处的颜色
+                }],
+              },
+              borderColor: '#b3baff',
+              borderWidth: 5
+            }
+          },
           tooltip: {
-            trigger: 'item',
-            className: 'custom-tooltip-box',
+            trigger: "item",
+            className: "custom-tooltip-box",
             confine: true, // 不超出当前表
-            formatter: function (params) {
-              console.log(params)
+
+            formatter: (params, ticket, callback) => {
+              console.log('走了点点了2', params)
+              // 清空所有轮播
+              for (var k in geoCoordMap) {
+                that.shanxiMap.dispatchAction({
+                  // type: 'geoUnSelect',
+                  type: 'downplay',
+                  name: k,
+                  geoIndex: 0
+                })
+              }
+              for (var k in geoCoordMap) {
+                that.shanxiMap.dispatchAction({
+                  // type: 'geoUnSelect',
+                  type: 'downplay',
+                  name: k,
+                  seriesName: params.seriesName
+                })
+              }
+              that.shanxiMap.dispatchAction({
+                // type: 'geoSelect',
+                type: 'highlight',
+                name: params.name,
+                geoIndex: 0
+              })
+              that.shanxiMap.dispatchAction({
+                // type: 'geoSelect',
+                type: 'highlight',
+                name: params.name,
+                seriesName: params.seriesName
+              })
               return `<div class="bgTooltip" style="background: url('../img/shanxi/${params.name}.png') no-repeat center center;background-size: 100% 100%;font-size:36px">
-            <div class="flex items-center">
-              <img src="./img/yellowArrow.png" style="width: 12px;height: 22px;margin-right:10px" alt=""><span class="fb">${params.name}</span>
-            </div>
-              <div class="blueIcon flex items-center">项目数量：<span class="fb" style="color:#68BDFF;">26<span style="font-size:20px" class="fn">个</span></span></div>
-              <div class="blueIcon flex items-center">投资总额：<span class="fb" style="color:#68BDFF">180<span style="font-size:20px" class="fn">亿</span></span></div>
-            </div>`
+              <div class="flex items-center">
+                <img src="./img/yellowArrow.png" style="width: 12px;height: 22px;margin-right:10px" alt=""><span class="fb">${params.name}</span>
+              </div>
+                <div class="blueIcon flex items-center">项目数量：<span class="fb" style="color:#68BDFF;">26<span style="font-size:20px" class="fn">个</span></span></div>
+                <div class="blueIcon flex items-center">投资总额：<span class="fb" style="color:#68BDFF">180<span style="font-size:20px" class="fn">亿</span></span></div>
+              </div>`
             },
           },
-          roam: false,
-          // itemStyle: {
-          //   normal: {
-          //     // borderColor: 'rgba(147, 235, 248, 1)',
-          //     borderColor: '#7fb3ff',
-          //     borderWidth: 3,
-          //     areaColor: {
-          //       type: 'radial',
-          //       x: 0.5,
-          //       y: 0.5,
-          //       r: 0.8,
-          //       colorStops: [{
-          //         offset: 0,
-          //         color: '#468ff8' // 0% 处的颜色
-          //       }, {
-          //         offset: 1,
-          //         color: '#0a2c6d' // 100% 处的颜色
-          //       }],
-          //       globalCoord: false // 缺省为 false
-          //     },
-          //     // shadowColor: 'rgba(128, 217, 248, 1)',
-          //     shadowColor: '#468ff8',
-          //     shadowOffsetX: -2,
-          //     shadowOffsetY: 2,
-          //     shadowBlur: 20
-          //   },
-          //   emphasis: {
-          //     areaColor: {
-          //       colorStops: [{
-          //         offset: 0,
-          //         color: '#3844aa' // 0% 处的颜色
-          //       }, {
-          //         offset: 1,
-          //         color: '#7284fc' // 100% 处的颜色
-          //       }],
-          //     },
-          //     borderColor: '#b3baff',
-          //     borderWidth: 5
-          //   }
-          // },
           regions: [
             {
               name: "太原市",
@@ -2657,16 +2685,6 @@ let app = new Vue({
           trigger: "item",
           className: "custom-tooltip-box",
           confine: true, // 不超出当前表
-          formatter: function (params) {
-            console.log(params);
-            return `<div class="bgTooltip" style="background: url('../img/shanxi/${params.name}.png') no-repeat center center;background-size: 100% 100%;font-size:36px">
-          <div class="flex items-center">
-            <img src="./img/yellowArrow.png" style="width: 12px;height: 22px;margin-right:10px" alt=""><span class="fb">${params.name}</span>
-          </div>
-            <div class="blueIcon flex items-center">项目数量：<span class="fb" style="color:#68BDFF;">26<span style="font-size:20px" class="fn">个</span></span></div>
-            <div class="blueIcon flex items-center">投资总额：<span class="fb" style="color:#68BDFF">180<span style="font-size:20px" class="fn">亿</span></span></div>
-          </div>`;
-          },
         },
         xAxis: {
           type: "value",
@@ -2714,69 +2732,55 @@ let app = new Vue({
         },
         series: [
           {
-            type: 'map',
-            map: 'china',
-            geoIndex: 1,
-            // aspectScale: 1.5, //长宽比
-            showLegendSymbol: true, // 存在legend时显示
+            type: 'effectScatter',
+            colorBy: 'data',
+            coordinateSystem: 'geo',
+            data: convertedData[0],
+            symbolSize: function (val) {
+              return Math.max(val[2] / 500, 8);
+            },
+            showEffectOn: "render",
+            rippleEffect: {
+              brushType: "stroke",
+            },
+            hoverAnimation: true,
             label: {
               normal: {
+                formatter: "{b}",
+                position: "right",
                 show: true,
-              },
-              emphasis: {
-                show: true,
-                textStyle: {
-                  color: 'red',
-                },
+                fontSize: "30",
+                color: "#fff",
               },
             },
-            roam: true,
             itemStyle: {
               normal: {
-                // borderColor: 'rgba(147, 235, 248, 1)',
-                borderColor: '#7fb3ff',
-                borderWidth: 3,
-                areaColor: {
-                  type: 'radial',
-                  x: 0.5,
-                  y: 0.5,
-                  r: 0.8,
-                  colorStops: [{
-                    offset: 0,
-                    color: '#468ff8' // 0% 处的颜色
-                  }, {
-                    offset: 1,
-                    color: '#0a2c6d' // 100% 处的颜色
-                  }],
-                  globalCoord: false // 缺省为 false
-                },
-                // shadowColor: 'rgba(128, 217, 248, 1)',
-                shadowColor: '#468ff8',
-                shadowOffsetX: -2,
-                shadowOffsetY: 2,
-                shadowBlur: 20
+                color: "#ffc809",
+                shadowBlur: 50,
+                shadowColor: "#ffc809",
               },
               emphasis: {
-                areaColor: {
-                  colorStops: [{
-                    offset: 0,
-                    color: '#3844aa' // 0% 处的颜色
-                  }, {
-                    offset: 1,
-                    color: '#7284fc' // 100% 处的颜色
-                  }],
-                },
-                borderColor: '#b3baff',
-                borderWidth: 5
-              }
+                color: '#58F7DF',
+                shadowBlur: 50,
+                shadowColor: '#58F7DF',
+              },
             },
-            animation: true,
-            data: data,
+            zlevel: 99
           },
           {
             type: 'effectScatter',
+            colorBy: 'data',
             coordinateSystem: 'geo',
-            data: convertedData[0],
+            data: [
+              {
+                "name": "太原市",
+                "value": [
+                  112.53,
+                  37.87,
+                  25167
+                ]
+              }
+            ],
             symbolSize: function (val) {
               return Math.max(val[2] / 500, 8);
             },
@@ -2799,10 +2803,14 @@ let app = new Vue({
                 color: "#ffc809",
                 shadowBlur: 50,
                 shadowColor: "#ffc809",
-                fontSize: "500",
+              },
+              emphasis: {
+                color: '#DF62F2',
+                shadowBlur: 50,
+                shadowColor: '#DF62F2',
               },
             },
-            // zlevel: 0
+            zlevel: 999
           }
         ]
       };
@@ -2825,6 +2833,7 @@ let app = new Vue({
       tools.loopShowTooltip(this.shanxiMap, option, {
         interval: 2000,
         loopSeries: false,
+        seriesIndex: 0
       });
       this.shanxiMap.setOption(option);
     },

investmentNew/js/index2.js

@@ -0,0 +1,2872 @@
+let app = new Vue({
+  el: "#app",
+  data() {
+    return {
+      leftEcharts1: "",
+      leftEcharts2: "",
+      leftEcharts3: "",
+      leftEcharts4: "",
+      leftEcharts5: "",
+      leftEcharts6: "",
+      leftEcharts7: "",
+      leftEcharts8: "",
+      shanxiMap: "", // 山西地图
+      industryProportion: 1, // 主辅业占比轮播
+      industryLayout: 0, //产业布局分析
+      time1: "", // 4秒定时器
+      time2: "", // 针对投前产业布局分析的定时器
+      meansList: [
+        {
+          label: "初步设计",
+          value: "106",
+        },
+        {
+          label: "详细设计",
+          value: "103",
+        },
+        {
+          label: "施工",
+          value: "62",
+        },
+        {
+          label: "完工",
+          value: "35",
+        },
+        {
+          label: "验收",
+          value: "42",
+        },
+        {
+          label: "结算",
+          value: "33",
+        },
+      ],
+      costList: [
+        {
+          num: 160,
+          value: 284,
+          status: "正偏差",
+        },
+        {
+          num: 280,
+          value: 129,
+          status: "容差内",
+        },
+        {
+          num: 103,
+          value: 1082,
+          status: "负偏差",
+        },
+      ],
+      investData: {
+        investList: [
+          {
+            name: "大地控股",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo15.png",
+          },
+          {
+            name: "云时代",
+            yse: "21.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo16.png",
+          },
+          {
+            name: "华舰体育",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo17.png",
+          },
+          {
+            name: "神农科技",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo18.png",
+          },
+          {
+            name: "山西焦煤",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo1.png",
+          },
+          {
+            name: "晋能控股",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo2.png",
+          },
+          {
+            name: "华阳新材",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo3.png",
+          },
+          {
+            name: "潞安化工",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo4.png",
+          },
+          {
+            name: "华新燃气",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo5.png",
+          },
+          {
+            name: "太重集团",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo6.png",
+          },
+          {
+            name: "国际能源",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo7.png",
+          },
+          {
+            name: "华远陆港",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo8.png",
+          },
+          {
+            name: "水控集团",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo9.png",
+          },
+          {
+            name: "文旅集团",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo10.png",
+          },
+          {
+            name: "交控集团",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo11.png",
+          },
+          {
+            name: "航产集团",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo12.png",
+          },
+          {
+            name: "山西建投",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo13.png",
+          },
+          {
+            name: "汾酒集团",
+            yse: "26.79",
+            yqhte: "9.64",
+            czrde: "121.59",
+            jse: "120.13",
+            fke: "36.4",
+            url: "./img/logos/logo14.png",
+          },
+        ],
+      },
+      inner: 0,
+      innerDeg: 0,
+      timer: null,
+      witchs: 0,
+      topIndex: 0,
+    };
+  },
+  created() {},
+  beforeDestroy() {
+    clearInterval(this.timer);
+  },
+  mounted() {
+    this.time4s();
+    this.timeNs();
+    this.filterLpData();
+    this.lpRotate();
+    setTimeout(() => {
+      this.leftEcharts1Fun();
+      this.leftEcharts2Fun();
+      this.leftEcharts3Fun();
+      this.leftEcharts4Fun();
+      this.leftEcharts5Fun();
+      this.leftEcharts6Fun();
+      this.leftEcharts7Fun();
+      this.leftEcharts8Fun();
+      this.chinaEchartsFun();
+      this.initChartR1();
+      this.initChartR2();
+      this.initChartR3();
+      this.initChartR4();
+    });
+  },
+  methods: {
+    initChartR1 () {
+      let that = this;
+      let sumA = 42;
+      let right5 = [[1, 2, 3, 4, 5, 6]];
+      let commonCompany = [
+        "山西焦煤",
+        "山西焦煤",
+        "山西焦煤",
+        "山西焦煤",
+        "山西焦煤",
+        "山西焦煤",
+      ];
+      // 所有在100范围外的全部变成0，其他值相应增加/减少sumA
+      // right5.forEach((item) => {
+      //   item.forEach((item2) => {
+      //     if (Number(item2[1]) < 0) {
+      //       item2[1] = that.$set(item2, 1, Number(that.numSub(item2[1], sumA)));
+      //     } else if (Number(item2[1]) > 0) {
+      //       item2[1] = that.$set(item2, 1, Number(item2[1]) + sumA);
+      //     }
+      //     if (Number(item2[1]) < -100 - sumA) {
+      //       item2[1] = that.$set(item2, 1, 0);
+      //       item2[1] = that.$set(item2, 2, 0);
+      //     } else if (Number(item2[1]) > 100 + sumA) {
+      //       item2[1] = that.$set(item2, 1, 0);
+      //       item2[1] = that.$set(item2, 2, 0);
+      //     }
+      //   });
+      // });
+
+      const itemStyle = {
+        // opacity: 0.8,
+        shadowBlur: 10,
+        shadowOffsetX: 0,
+        shadowOffsetY: 0,
+        shadowColor: "rgba(0,0,0,0.3)",
+      };
+      that.right2Chart = echarts.init(this.$refs["echartR1"]);
+      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: {
+          selectedMode: false,
+          top: 10,
+          right: "6%",
+          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}：${that.numFormat(
+        //       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}：${that.numFormat(
+        //       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}：${that.numFormat(
+        //       data[2].data[2]
+        //     )}亿`;
+        //   },
+        //   axisPointer: {
+        //     //  // type: 'cross',',
+        //   },
+        // },
+        grid: {
+          top: "10%",
+          right: "7%",
+          left: "7%",
+          bottom: "6%",
+        },
+        yAxis: {
+          min: -101 - sumA,
+          max: 101 + sumA,
+          maxInterval: 1,
+          splitLine: {
+            show: false,
+            // interval:,
+            lineStyle: {
+              color: "#68b4dd66",
+              type: "dashed",
+            },
+          },
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLabel: {
+            show: true,
+            // formatter: '{value}',
+            formatter (data) {
+              if (data == 100 + sumA) {
+                return "100%";
+              } else if (data == -100 - sumA) {
+                return "-100%";
+              } else if (data == -5 - sumA) {
+                return "-5%";
+              } else if (data == 5 + sumA) {
+                return "5%";
+              }
+            },
+            textStyle: {
+              color: "#fff",
+              fontSize: "20",
+              fontFamily: "Microsoft YaHei",
+            },
+          },
+          nameTextStyle: {
+            color: "#fff",
+            fontSize: 20,
+            fontFamily: "Microsoft YaHei",
+          },
+        },
+        xAxis: {
+          data: commonCompany,
+          axisLine: {
+            show: false, //隐藏X轴轴线
+            lineStyle: {
+              color: "#005094",
+              width: 1,
+            },
+          },
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: "#68b4dd66",
+              type: "dashed",
+            },
+          },
+          axisTick: {
+            show: true, //隐藏X轴刻度
+          },
+          axisLabel: {
+            show: true,
+            rotate: 20,
+            padding: [0, 0, 0, 0],
+            textStyle: {
+              color: "#fff", //X轴文字颜色
+              fontSize: 22,
+              fontFamily: "Microsoft YaHei",
+            },
+          },
+        },
+        series: [
+          {
+            name: "正偏差",
+            type: "scatter",
+            itemStyle: itemStyle,
+            data: right5[0],
+            symbolSize: function (data) {
+              if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
+                return 40;
+              } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
+                return 70;
+              } else if (data[2] > 100) {
+                return 100;
+              }
+            },
+            markLine: {
+              symbol: "none",
+              data: [
+                {
+                  name: "100%",
+                  yAxis: 100 + sumA,
+                  lineStyle: {
+                    // color: '#fff',
+                  },
+                  label: {
+                    show: false,
+                    formatter: "{b}",
+                    position: "right",
+                    color: "#fff",
+                    fontSize: 20,
+                    label: {
+                      show: false,
+                    },
+                  },
+                },
+                {
+                  name: "5%",
+                  yAxis: 5 + sumA,
+                  lineStyle: {
+                    // color: '#fff',
+                  },
+                  label: {
+                    show: false,
+                    formatter: "{b}",
+                    position: "right",
+                    color: "#fff",
+                    fontSize: 20,
+                  },
+                },
+                {
+                  name: "-5%",
+                  yAxis: -5 - sumA,
+                  lineStyle: {
+                    // color: '#fff',
+                  },
+                  label: {
+                    show: false,
+                    formatter: "{b}",
+                    position: "right",
+                    color: "#fff",
+                    fontSize: 20,
+                  },
+                },
+                {
+                  name: "100%",
+                  yAxis: -100 - sumA,
+                  lineStyle: {
+                    // color: '#fff',
+                  },
+                  label: {
+                    show: false,
+                    formatter: "{b}",
+                    position: "right",
+                    color: "#fff",
+                    fontSize: 20,
+                  },
+                },
+              ],
+            },
+          },
+          {
+            name: "容差",
+            type: "scatter",
+            itemStyle: itemStyle,
+            data: right5[1],
+            symbolSize: function (data) {
+              if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
+                return 40;
+              } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
+                return 70;
+              } else if (data[2] > 100) {
+                return 100;
+              }
+            },
+          },
+          {
+            name: "负偏差",
+            type: "scatter",
+            itemStyle: itemStyle,
+            data: right5[2],
+            symbolSize: function (data) {
+              if ((data[2] > 0 && data[2] < 50) || data[2] == 50) {
+                return 40;
+              } else if ((data[2] > 50 && data[2] < 100) || data[2] == 100) {
+                return 70;
+              } else if (data[2] > 100) {
+                return 100;
+              }
+            },
+          },
+        ],
+      };
+      that.right2Chart.on("click", function (param) {
+        if (that.versions) {
+          that.rightAdd.modelName = 1;
+          that.rightAdd.substraction =
+            param.seriesName == "正偏差"
+              ? 1
+              : param.seriesName == "容差"
+                ? 2
+                : 3;
+          that.rightAdd.projectStepCode = "";
+          that.projectNum = 313;
+          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,
+      });
+    },
+    initChartR2 () {
+      let that = this;
+      that.right1Chart = echarts.init(this.$refs["echartR2"]);
+      let option = {
+        color: [
+          {
+            type: "linear",
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: "#91231F", // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: "#F98784", // 100% 处的颜色
+              },
+            ],
+            global: false, // 缺省为 false
+          },
+          {
+            type: "linear",
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: "#9F7F00", // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: "#FBE463", // 100% 处的颜色
+              },
+            ],
+            global: false, // 缺省为 false
+          },
+          {
+            type: "linear",
+            x: 0,
+            y: 0,
+            x2: 0,
+            y2: 1,
+            colorStops: [
+              {
+                offset: 0,
+                color: "#07806E", // 0% 处的颜色
+              },
+              {
+                offset: 1,
+                color: "#79FFEB", // 100% 处的颜色
+              },
+            ],
+            global: false, // 缺省为 false
+          },
+        ],
+        legend: {
+          top: 10,
+          right: 10,
+          textStyle: {
+            fontSize: 20,
+            color: "#fff",
+            fontFamily: "Microsoft YaHei",
+          },
+          itemStyle: {
+            borderCap: "round",
+          },
+        },
+        grid: {
+          left: "3%",
+          right: "4%",
+          bottom: "3%",
+          containLabel: true,
+        },
+        xAxis: [
+          {
+            type: "category",
+            data: [
+              "山西焦煤",
+              "华阳控股",
+              "晋能控股",
+              "潞安化工",
+              "国际能源",
+              "云时代",
+              "航产集团",
+            ],
+            axisLine: {
+              lineStyle: {
+                color: "#005094",
+              },
+            },
+            axisTick: {
+              show: false,
+            },
+            axisLabel: {
+              color: "#fff",
+              rotate: 20,
+              fontSize: 22,
+            },
+          },
+        ],
+        yAxis: [
+          {
+            type: "value",
+            axisLabel: {
+              color: "#fff",
+              fontSize: 22,
+            },
+            splitLine: {
+              lineStyle: {
+                type: "dashed",
+              },
+            },
+          },
+        ],
+        series: [
+          {
+            name: "低风险",
+            type: "bar",
+            stack: "Ad",
+            barWidth: 14,
+            emphasis: {
+              focus: "series",
+            },
+            itemStyle: {
+              barBorderRadius: [15, 15, 15, 15],
+            },
+            data: [120, 132, 101, 134, 90, 230, 210],
+          },
+          {
+            name: "中风险",
+            type: "bar",
+            stack: "Ad",
+            itemStyle: {
+              barBorderRadius: [15, 15, 15, 15],
+            },
+            emphasis: {
+              focus: "series",
+            },
+            data: [220, 182, 191, 234, 290, 330, 310],
+          },
+          {
+            name: "高风险",
+            type: "bar",
+            stack: "Ad",
+            itemStyle: {
+              barBorderRadius: [15, 15, 15, 15],
+            },
+            emphasis: {
+              focus: "series",
+            },
+            data: [150, 232, 201, 154, 190, 330, 410],
+          },
+        ],
+      };
+      that.right1Chart.setOption(option);
+    },
+    initChartR3() {
+      let that = this;
+      that.right3Chart = echarts.init(this.$refs["echartR3"]);
+      let option = {
+        radar: {
+          // shape: 'circle',
+          splitNumber: 3,
+          splitLine: {
+            lineStyle: {
+              color: ["#DD5955", "#39e1d0", "#2e3d45"],
+            },
+          },
+          splitArea: {
+            areaStyle: {
+              color: [
+                "rgba(88,247,223,0.2)",
+                "rgba(255, 224, 54, 0.2)",
+                "rgba(221,89,85,0.3)",
+              ],
+            },
+          },
+          indicator: [
+            { name: "安全风险", max: 25 },
+            { name: "付款风险", max: 25 },
+            { name: "合同风险", max: 25 },
+            { name: "结算风险", max: 25 },
+            { name: "进度风险", max: 25 },
+            { name: "质量风险", max: 25 },
+          ],
+        },
+        series: [
+          {
+            name: "风险",
+            type: "radar",
+            symbol: "circle",
+            data: [
+              {
+                value: [12, 23, 21, 17, 20, 9],
+                name: "Allocated Budget",
+                areaStyle: {
+                  color: "#112b75",
+                },
+                lineStyle: {
+                  width: 4,
+                  color: "#60C1FF",
+                },
+                label: {
+                  fontSize: 22,
+                },
+              },
+            ],
+          },
+        ],
+      };
+      that.right3Chart.setOption(option);
+    },
+    initChartR4() {
+      let that = this;
+      that.right4Chart = echarts.init(this.$refs["echartR4"]);
+      let option = {
+        tooltip: {
+          trigger: "item",
+          show: true,
+
+          formatter: function (p) {
+            console.info(p);
+            return p.marker + p.name + " : " + p.value;
+          },
+        },
+        grid: {
+          left: "3%",
+          right: "4%",
+          bottom: "3%",
+          containLabel: true,
+        },
+        xAxis: {
+          data: ["山西焦煤", "晋能控股", "华阳新材"],
+          type: "category",
+          splitLine: {
+            show: false,
+          },
+          axisLine: {
+            show: true,
+            lineStyle: {
+              color: "#fff",
+            },
+          },
+          axisTick: {
+            show: true,
+          },
+          axisLabel: {
+            color: "#fff",
+            fontSize: 22,
+            rotate: 20,
+          },
+        },
+        yAxis: {
+          type: "value",
+          splitNumber: 4,
+          interval: 50,
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: "#68B4DD",
+              type: "dashed",
+            },
+          },
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLabel: {
+            color: "#fff",
+            fontSize: 22,
+          },
+        },
+        series: [
+          {
+            type: "bar",
+            animation: false,
+            barWidth: 2,
+            data: [60, 85, 110],
+            tooltip: {
+              show: false,
+            },
+            itemStyle: {
+              color: {
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: "rgba(85, 255, 237, 1)", // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: "rgba(66, 142, 255, 0.05)", // 100% 处的颜色
+                  },
+                ],
+              },
+            },
+          },
+          {
+            type: "scatter",
+            data: [60, 85, 110],
+            symbolOffset: ["-120%", "0"],
+            symbolSize: 8,
+            itemStyle: {
+              borderWidth: 0,
+              opacity: 1,
+              color: "rgba(85, 255, 237, 1)",
+              shadowColor: "rgba(85, 255, 237, 1)",
+              shadowBlur: 100,
+              shadowOffsetX: 100,
+            },
+          },
+          {
+            type: "bar",
+            animation: false,
+            barGap: "800%",
+            barWidth: 2,
+            data: [60, 85, 110],
+            tooltip: {
+              show: false,
+            },
+            itemStyle: {
+              color: {
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [
+                  {
+                    offset: 0,
+                    color: "rgba(214, 91, 255, 1)", // 0% 处的颜色
+                  },
+                  {
+                    offset: 1,
+                    color: "rgba(184, 91, 255, 0.05)", // 100% 处的颜色
+                  },
+                ],
+              },
+            },
+          },
+          {
+            type: "scatter",
+            data: [60, 85, 110],
+            symbolOffset: ["110%", "0"],
+            symbolSize: 8,
+            itemStyle: {
+              borderWidth: 0,
+              opacity: 1,
+              color: "#f2fec3",
+            },
+          },
+        ],
+      };
+      that.right4Chart.setOption(option);
+    },
+    clickItem (index) {
+      console.log(index);
+      const angle = 360 / this.investData.investList.length;
+      this.witchs = index;
+      this.inner = index;
+      this.innerDeg = this.witchs * angle;
+      this.lpRotate();
+    },
+    lpRotate () {
+      const angle = 360 / this.investData.investList.length;
+      clearInterval(this.timer);
+      this.timer = setInterval(() => {
+        this.inner++;
+        this.topIndex++;
+        this.topIndex = this.topIndex % this.meansList.length;
+        this.witchs = this.inner % this.investData.investList.length;
+        this.innerDeg = this.inner * angle;
+      }, 2000);
+    },
+    filterLpData () {
+      const angle = 360 / this.investData.investList.length;
+      for (let i in this.investData.investList) {
+        this.investData.investList[i].deg = i * angle;
+        this.$set(this.investData.investList, i, {
+          ...this.investData.investList[i],
+          deg: i * angle,
+        });
+      }
+    },
+    // 4秒定时器
+    time4s() {
+      let that = this;
+      // 4秒定时器
+      this.time1 = setInterval(() => {
+        that.industryProportion == 1
+          ? (that.industryProportion = 2)
+          : (that.industryProportion = 1);
+        that.leftEcharts1.dispose();
+        that.leftEcharts2.dispose();
+        that.leftEcharts3.dispose();
+        that.leftEcharts4.dispose();
+        that.leftEcharts1Fun();
+        that.leftEcharts2Fun();
+        that.leftEcharts3Fun();
+        that.leftEcharts4Fun();
+      }, 4000);
+    },
+    // 针对投前产业布局分析的定时器
+    timeNs() {
+      let that = this;
+      this.time2 = setInterval(() => {
+        if (that.industryLayout < 3) {
+          that.industryLayout = that.industryLayout + 1;
+        } else {
+          that.industryLayout = 0;
+        }
+        this.time2 && clearInterval(this.time2);
+        this.timeNs();
+        that.leftEcharts5.dispose();
+        that.leftEcharts5Fun();
+      }, left1[that.industryLayout].length * 2000);
+    },
+    // 主辅业占比点击方法
+    industryProportionChange(e) {
+      let that = this;
+      this.industryProportion = e;
+      this.time1 && clearInterval(this.time1);
+      that.leftEcharts1.dispose();
+      that.leftEcharts2.dispose();
+      that.leftEcharts3.dispose();
+      that.leftEcharts4.dispose();
+      that.leftEcharts1Fun();
+      that.leftEcharts2Fun();
+      that.leftEcharts3Fun();
+      that.leftEcharts4Fun();
+      this.time4s();
+    },
+    // 产业布局分析点击方法
+    industryLayoutChange(e) {
+      this.industryLayout = e;
+    },
+    yuanChange(value) {
+      return Number((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 {
+          floatPart = floatPart.slice(0, 2);
+          return intPartFormat + "." + floatPart;
+        }
+      } else {
+        return intPartFormat;
+      }
+    },
+    leftEcharts1Fun() {
+      let that = this;
+      this.leftEcharts1 = echarts.init(this.$refs["leftEcharts1"]);
+      option = {
+        title: {
+          text: that.industryProportion == 1 ? "30%" : "70%",
+          x: "center",
+          y: "center",
+          textStyle: {
+            fontWeight: "normal",
+            color: "#68BDFF",
+            fontSize: "20",
+          },
+        },
+        color: ["#68BDFF", "#254F7F"],
+        series: [
+          {
+            name: "Line 1",
+            type: "pie",
+            clockWise: true,
+            radius: ["80%", "100%"],
+            itemStyle: {
+              normal: {
+                label: {
+                  show: false,
+                },
+                labelLine: {
+                  show: false,
+                },
+              },
+            },
+            hoverAnimation: false,
+            data: [
+              {
+                value: 80,
+                name: "01",
+                itemStyle: {
+                  normal: {
+                    label: {
+                      show: false,
+                    },
+                    labelLine: {
+                      show: false,
+                    },
+                  },
+                },
+              },
+              {
+                name: "02",
+                value: 20,
+              },
+            ],
+          },
+        ],
+      };
+      //轮播
+      // tools.loopShowTooltip(leftEcharts1, option, {
+      //   interval: 2000,
+      //   loopSeries: true,
+      // });
+      //注册
+      that.leftEcharts1.setOption(option);
+    },
+    leftEcharts2Fun() {
+      let that = this;
+      this.leftEcharts2 = echarts.init(this.$refs["leftEcharts2"]);
+      let nameList = ["a"];
+      let valueList = that.industryProportion == 1 ? [30] : [70];
+      let total = 100; // 数据总数
+      var category = nameList.map((item, index) => {
+        return {
+          value: valueList[index],
+          itemStyle: {
+            color: new echarts.graphic.LinearGradient(
+              1,
+              0,
+              0,
+              1,
+              [
+                {
+                  offset: 0,
+                  color: "#40A9FF50",
+                },
+                {
+                  offset: 1,
+                  color: "#40A9FF",
+                },
+              ],
+              false
+            ),
+          },
+        };
+      });
+      var totalList = [];
+      var totalBorderList = [];
+      nameList.map((item, index) => {
+        totalList.push({
+          value: total,
+          itemStyle: {
+            color: "rgba(51, 147, 236, 0.29)",
+          },
+        });
+        totalBorderList.push({
+          value: total,
+          itemStyle: {
+            borderColor: "rgba(51, 147, 236, 0.29)",
+            color: "transparent",
+          },
+        });
+      });
+      var datas = [];
+      category.forEach((value) => {
+        datas.push(value.value);
+      });
+      option = {
+        // backgroundColor: 'rgb(231,238,249)',
+        xAxis: {
+          max: total,
+          splitLine: {
+            show: false,
+          },
+          axisLine: {
+            show: false,
+          },
+          axisLabel: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          },
+        },
+        grid: {
+          left: "0%",
+          top: "15%", // 设置条形图的边距
+          right: "15%",
+          bottom: "5%",
+        },
+        yAxis: [
+          {
+            type: "category",
+            inverse: false,
+            data: nameList,
+            axisLine: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+            axisLabel: {
+              show: false,
+            },
+          },
+        ],
+        series: [
+          {
+            // 内
+            type: "bar",
+            barWidth: 16,
+            barGap: "20%",
+            silent: true,
+            // label: {
+            //     normal: {
+            //         formatter: (item) => {
+            //             return `${item['name']}：${item['value']} `;
+            //         },
+            //         textStyle: {
+            //             color: 'rgba(105, 120, 136, 1)',
+            //             fontSize: 14,
+            //         },
+            //         position: [0, '-25px'],
+            //         show: true,
+            //     },
+            // },
+            data: category,
+            z: 1,
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(
+                  1,
+                  0,
+                  0,
+                  1,
+                  [
+                    {
+                      offset: 0,
+                      color: "rgba(81, 193, 156, 1)",
+                    },
+                    {
+                      offset: 1,
+                      color: "rgba(234, 177, 100, 1)",
+                    },
+                  ],
+                  false
+                ),
+              },
+            },
+            animationEasing: "elasticOut",
+          },
+
+          {
+            // 分隔
+            type: "pictorialBar",
+            itemStyle: {
+              normal: {
+                color: "#143362",
+              },
+            },
+            symbolRepeat: "fixed",
+            symbolMargin: 8,
+            symbol: "rect",
+            symbolClip: false,
+            symbolSize: [4, 20],
+            symbolPosition: "start",
+            symbolOffset: [0, -2],
+            symbolBoundingData: total,
+            data: [total, total, total, total],
+            z: 2,
+            animationEasing: "elasticOut",
+          },
+          {
+            // label
+            type: "pictorialBar",
+            symbolBoundingData: total,
+            itemStyle: {
+              normal: {
+                color: "none",
+              },
+            },
+            label: {
+              normal: {
+                formatter: (params) => {
+                  var text;
+                  text = `${((params["data"] * 100) / total).toFixed(2)}亿`;
+                  return text;
+                },
+                textStyle: {
+                  // 图列内容样式
+                  fontSize: "20",
+                  fontWeight: 800,
+                },
+                position: "right",
+                offset: [0, -3],
+                distance: 10, // 向右偏移位置
+                show: true,
+                color: "#68BDFF",
+              },
+            },
+            data: datas,
+            z: 0,
+          },
+          {
+            name: "外框",
+            type: "bar",
+            barGap: "-130%", // 设置外框粗细
+            data: totalBorderList,
+            barWidth: 26,
+            itemStyle: {
+              normal: {
+                // barBorderRadius: [5, 5, 5, 5],
+                borderWidth: 1, // 边框宽度
+                borderColor: "rgb(51, 147, 236)", // 边框色
+                color: "rgb(231,238,249)",
+              },
+            },
+            z: 0,
+          },
+        ],
+      };
+
+      //轮播
+      // tools.loopShowTooltip(leftEcharts1, option, {
+      //   interval: 2000,
+      //   loopSeries: true,
+      // });
+      //注册
+      that.leftEcharts2.setOption(option);
+    },
+    leftEcharts3Fun() {
+      let that = this;
+      this.leftEcharts3 = echarts.init(this.$refs["leftEcharts3"]);
+      option = {
+        title: {
+          text: that.industryProportion == 1 ? "70%" : "30%",
+          x: "center",
+          y: "center",
+          textStyle: {
+            fontWeight: "normal",
+            color: "#68BDFF",
+            fontSize: "20",
+          },
+        },
+        color: ["#5BDCC8", "#254F7F"],
+        series: [
+          {
+            name: "Line 1",
+            type: "pie",
+            clockWise: true,
+            radius: ["80%", "100%"],
+            itemStyle: {
+              normal: {
+                label: {
+                  show: false,
+                },
+                labelLine: {
+                  show: false,
+                },
+              },
+            },
+            hoverAnimation: false,
+            data: [
+              {
+                value: 80,
+                name: "01",
+                itemStyle: {
+                  normal: {
+                    label: {
+                      show: false,
+                    },
+                    labelLine: {
+                      show: false,
+                    },
+                  },
+                },
+              },
+              {
+                name: "02",
+                value: 20,
+              },
+            ],
+          },
+        ],
+      };
+      //轮播
+      // tools.loopShowTooltip(leftEcharts1, option, {
+      //   interval: 2000,
+      //   loopSeries: true,
+      // });
+      //注册
+      that.leftEcharts3.setOption(option);
+    },
+    leftEcharts4Fun() {
+      let that = this;
+      this.leftEcharts4 = echarts.init(this.$refs["leftEcharts4"]);
+      let nameList = ["a"];
+      let valueList = that.industryProportion == 1 ? [70] : [30];
+      let total = 100; // 数据总数
+      var category = nameList.map((item, index) => {
+        return {
+          value: valueList[index],
+          itemStyle: {
+            color: new echarts.graphic.LinearGradient(
+              1,
+              0,
+              0,
+              1,
+              [
+                {
+                  offset: 0,
+                  color: "#5BDCC850",
+                },
+                {
+                  offset: 1,
+                  color: "#5BDCC8",
+                },
+              ],
+              false
+            ),
+          },
+        };
+      });
+      var totalList = [];
+      var totalBorderList = [];
+      nameList.map((item, index) => {
+        totalList.push({
+          value: total,
+          itemStyle: {
+            color: "rgba(51, 147, 236, 0.29)",
+          },
+        });
+        totalBorderList.push({
+          value: total,
+          itemStyle: {
+            borderColor: "rgba(51, 147, 236, 0.29)",
+            color: "transparent",
+          },
+        });
+      });
+      var datas = [];
+      category.forEach((value) => {
+        datas.push(value.value);
+      });
+      option = {
+        // backgroundColor: 'rgb(231,238,249)',
+        xAxis: {
+          max: total,
+          splitLine: {
+            show: false,
+          },
+          axisLine: {
+            show: false,
+          },
+          axisLabel: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          },
+        },
+        grid: {
+          left: "0%",
+          top: "15%", // 设置条形图的边距
+          right: "15%",
+          bottom: "5%",
+        },
+        yAxis: [
+          {
+            type: "category",
+            inverse: false,
+            data: nameList,
+            axisLine: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+            axisLabel: {
+              show: false,
+            },
+          },
+        ],
+        series: [
+          {
+            // 内
+            type: "bar",
+            barWidth: 16,
+            barGap: "20%",
+            silent: true,
+            // label: {
+            //     normal: {
+            //         formatter: (item) => {
+            //             return `${item['name']}：${item['value']} `;
+            //         },
+            //         textStyle: {
+            //             color: 'rgba(105, 120, 136, 1)',
+            //             fontSize: 14,
+            //         },
+            //         position: [0, '-25px'],
+            //         show: true,
+            //     },
+            // },
+            data: category,
+            z: 1,
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(
+                  1,
+                  0,
+                  0,
+                  1,
+                  [
+                    {
+                      offset: 0,
+                      color: "rgba(81, 193, 156, 1)",
+                    },
+                    {
+                      offset: 1,
+                      color: "rgba(234, 177, 100, 1)",
+                    },
+                  ],
+                  false
+                ),
+              },
+            },
+            animationEasing: "elasticOut",
+          },
+
+          {
+            // 分隔
+            type: "pictorialBar",
+            itemStyle: {
+              normal: {
+                color: "#143362",
+              },
+            },
+            symbolRepeat: "fixed",
+            symbolMargin: 8,
+            symbol: "rect",
+            symbolClip: false,
+            symbolSize: [4, 20],
+            symbolPosition: "start",
+            symbolOffset: [0, -2],
+            symbolBoundingData: total,
+            data: [total, total, total, total],
+            z: 2,
+            animationEasing: "elasticOut",
+          },
+          {
+            // label
+            type: "pictorialBar",
+            symbolBoundingData: total,
+            itemStyle: {
+              normal: {
+                color: "none",
+              },
+            },
+            label: {
+              normal: {
+                formatter: (params) => {
+                  var text;
+                  text = `${((params["data"] * 100) / total).toFixed(2)}亿`;
+                  return text;
+                },
+                textStyle: {
+                  // 图列内容样式
+                  fontSize: "20",
+                  fontWeight: 800,
+                },
+                position: "right",
+                offset: [0, -3],
+                distance: 10, // 向右偏移位置
+                show: true,
+                color: "#68BDFF",
+              },
+            },
+            data: datas,
+            z: 0,
+          },
+          {
+            name: "外框",
+            type: "bar",
+            barGap: "-130%", // 设置外框粗细
+            data: totalBorderList,
+            barWidth: 26,
+            itemStyle: {
+              normal: {
+                // barBorderRadius: [5, 5, 5, 5],
+                borderWidth: 1, // 边框宽度
+                borderColor: "rgb(51, 147, 236)", // 边框色
+                color: "rgb(231,238,249)",
+              },
+            },
+            z: 0,
+          },
+        ],
+      };
+
+      //轮播
+      // tools.loopShowTooltip(leftEcharts1, option, {
+      //   interval: 2000,
+      //   loopSeries: true,
+      // });
+      //注册
+      that.leftEcharts4.setOption(option);
+    },
+    leftEcharts5Fun() {
+      let that = this;
+      this.leftEcharts5 = echarts.init(this.$refs["leftEcharts5"]);
+      let dataList = [];
+      left1[that.industryLayout].forEach((item, index) => {
+        dataList[index] = {
+          value: item.y,
+          name: item.name,
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(1, 0, 0, 1, [
+                {
+                  offset: 0,
+                  color: commonColor2[index], //顶部颜色
+                },
+                {
+                  offset: 1,
+                  color: commonColor[index], // 底部颜色
+                },
+              ]),
+              borderColor: commonColor[index],
+              borderWidth: 3,
+            },
+          },
+        };
+      });
+      let option = {
+        tooltip: {
+          trigger: "item",
+          formatter: function (e) {
+            return `<span style="display:inline-block;margin-right:15px;border-radius:10px;width:20px;height:20px;background-color:${
+              e.borderColor
+            };"></span>${e.name} ${e.percent}%<br>${e.value}亿 ${
+              left1[that.industryLayout][e.seriesIndex].num
+            }个`;
+          },
+          backgroundColor: "rgba(50,50,50,0.7)", // 提示框浮层的背景颜色
+          textStyle: {
+            color: "#fff",
+            fontStyle: "normal", // 文字字体的风格（'normal'，无样式；'italic'，斜体；'oblique'，倾斜字体）
+            fontWeight: "normal", // 文字字体的粗细（'normal'，无样式；'bold'，加粗；'bolder'，加粗的基础上再加粗；'lighter'，变细；数字定义粗细也可以，取值范围100至700）
+            fontSize: "28", // 文字字体大小
+          },
+        },
+        legend: {
+          top: "center",
+          orient: "vertical",
+          left: "75%",
+          textStyle: {
+            color: "#fff",
+            fontSize: 28,
+            padding: [0, 20],
+          },
+        },
+        graphic: {
+          elements: [
+            {
+              type: "image", //需要填充图片,配置image,如果不需要图片可以配置其他的, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group,
+              style: {
+                image: "./img/whiteCircle.png", //这里添加图片地址
+                width: 80,
+                height: 80,
+              },
+              left: "center", //
+              top: "middle", //配置图片居中
+            },
+          ],
+        },
+        series: [
+          {
+            name: "",
+            type: "pie",
+            radius: ["20%", "80%"],
+            labelLine: {
+              normal: {
+                lineStyle: {
+                  width: 1,
+                },
+              },
+            },
+            label: {
+              normal: {
+                show: false,
+                textStyle: {
+                  fontSize: 28,
+                  color: "#fff",
+                },
+              },
+            },
+            roseType: "area",
+            data: dataList,
+          },
+          {
+            tooltip: {
+              show: false,
+            },
+            type: "pie",
+            radius: ["80%", "82%"],
+            hoverAnimation: false,
+            name: "",
+            data: [
+              {
+                name: "",
+                value: 0,
+                itemStyle: {
+                  normal: {
+                    color: "#345189",
+                  },
+                },
+              },
+            ],
+          },
+        ],
+      };
+      //轮播
+      tools.loopShowTooltip(that.leftEcharts5, option, {
+        interval: 2000,
+        loopSeries: true,
+      });
+      //注册
+      that.leftEcharts5.setOption(option);
+    },
+    leftEcharts6Fun() {
+      let that = this;
+      this.leftEcharts6 = echarts.init(this.$refs["leftEcharts6"]);
+      var dataArr = 44;
+      var colorSet = {
+        color: "#22B95E",
+      };
+      var color1 = {
+        type: "linear",
+        x: 0,
+        y: 0,
+        x2: 1,
+        y2: 1,
+        colorStops: [
+          {
+            offset: 0,
+            color: "rgba(255,255,255,0.1)",
+          },
+          {
+            offset: 1,
+            color: "rgba(255,255,255,0.3)",
+          },
+        ],
+        global: false,
+      };
+      var color2 = {
+        type: "linear",
+        x: 0,
+        y: 0,
+        x2: 1,
+        y2: 1,
+        colorStops: [
+          {
+            offset: 0,
+            color: "#30DBBA",
+          },
+          {
+            offset: 1,
+            color: "#2DE696",
+          },
+        ],
+        global: false,
+      };
+
+      option = {
+        tooltip: {
+          formatter: "{a} <br/>{b} : {c}%",
+        },
+        series: [
+          {
+            name: "内部进度条",
+            type: "gauge",
+            // center: ['20%', '50%'],
+            radius: "50%",
+
+            splitNumber: 10,
+            axisLine: {
+              lineStyle: {
+                color: [
+                  [dataArr / 100, "rgba(0,0,0,0)"],
+                  [1, "rgba(0,0,0,0)"],
+                ],
+                width: 1,
+              },
+            },
+            axisLabel: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+            splitLine: {
+              show: false,
+            },
+            itemStyle: {
+              color: "#ffffff",
+            },
+            detail: {
+              formatter: function (value) {
+                if (value !== 0) {
+                  var num = Math.round(value);
+                  return parseInt(num).toFixed(0) + "%";
+                } else {
+                  return 0;
+                }
+              },
+              offsetCenter: [0, 117],
+              textStyle: {
+                padding: [0, 0, 0, 0],
+                fontSize: 60,
+                color: "#58F7DF",
+              },
+            },
+            title: {
+              //标题
+              show: true,
+              offsetCenter: [0, 220], // x, y，单位px
+              textStyle: {
+                color: "#40A9FF",
+                fontSize: 34, //表盘上的标题文字大小
+                fontWeight: 400,
+                fontFamily: "MicrosoftYaHei",
+              },
+            },
+            data: [
+              {
+                name: "总额度:1,323.85亿",
+                value: dataArr,
+                itemStyle: {
+                  fontSize: "50", //y轴上方单位的大小
+                  color: "#FFF666",
+                  fontFamily: "MicrosoftYaHei",
+                },
+              },
+            ],
+            pointer: {
+              show: true,
+              length: "100%",
+              radius: "20%",
+              width: 3, //指针粗细
+            },
+            animationDuration: 4000,
+          },
+          {
+            name: "内部阴影",
+            type: "gauge",
+            radius: "75%",
+            splitNumber: 10,
+            axisLine: {
+              lineStyle: {
+                color: [
+                  [
+                    dataArr / 100,
+                    new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                      {
+                        offset: 0,
+                        color: "#081947",
+                      },
+                      {
+                        offset: 0.5,
+                        color: "#5DF5A9",
+                      },
+                      {
+                        offset: 1,
+                        color: "#F6F16A",
+                      },
+                    ]),
+                  ],
+                  [1, "#0E4889"],
+                ],
+                width: 70,
+              },
+            },
+            axisLabel: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+            splitLine: {
+              show: false,
+            },
+            itemStyle: {
+              show: false,
+            },
+          },
+          {
+            name: "外部刻度",
+            type: "gauge",
+            //  center: ['20%', '50%'],
+            radius: "90%",
+            min: 0, //最小刻度
+            max: 100, //最大刻度
+            splitNumber: 5, //刻度数量
+            startAngle: 225,
+            endAngle: -45,
+            axisLine: {
+              show: true,
+              lineStyle: {
+                width: 1,
+                color: [[1, "rgba(0,0,0,0)"]],
+              },
+            }, //仪表盘轴线
+            axisLabel: {
+              show: false,
+              color: "#ffffff",
+              fontSize: 28,
+              fontFamily: "SourceHanSansSC-Regular",
+              fontWeight: "bold",
+              // position: "top",
+              distance: -45,
+              formatter: function (v) {
+                switch (v + "") {
+                  case "0":
+                    return "0";
+                  case "10":
+                    return "10";
+                  case "20":
+                    return "20";
+                  case "30":
+                    return "30";
+                  case "40":
+                    return "40";
+                  case "50":
+                    return "50";
+                  case "60":
+                    return "60";
+                  case "70":
+                    return "70";
+                  case "80":
+                    return "80";
+                  case "90":
+                    return "90";
+                  case "100":
+                    return "100";
+                }
+              },
+            }, //刻度标签。
+            axisTick: {
+              show: true,
+              splitNumber: 10,
+              lineStyle: {
+                color: "#3798D7", //用颜色渐变函数不起作用
+                width: 1,
+              },
+              length: -6,
+            }, //刻度样式
+            splitLine: {
+              show: true,
+              length: -12,
+              lineStyle: {
+                color: "#3798D7", //用颜色渐变函数不起作用
+              },
+            }, //分隔线样式
+            detail: {
+              show: false,
+            },
+          },
+          {
+            //指针上的圆
+            type: "pie",
+            tooltip: {
+              show: false,
+            },
+            hoverAnimation: false,
+            legendHoverLink: false,
+            radius: ["0%", "4%"],
+            center: ["50%", "50%"],
+            label: {
+              normal: {
+                show: false,
+              },
+            },
+            labelLine: {
+              normal: {
+                show: false,
+              },
+            },
+            data: [
+              {
+                value: 120,
+                itemStyle: {
+                  normal: {
+                    color: "#ffffff",
+                  },
+                },
+              },
+            ],
+          },
+        ],
+      };
+
+      //轮播
+      // tools.loopShowTooltip(leftEcharts1, option, {
+      //   interval: 2000,
+      //   loopSeries: true,
+      // });
+      //注册
+      that.leftEcharts6.setOption(option);
+    },
+    leftEcharts7Fun() {
+      let that = this;
+      this.leftEcharts7 = echarts.init(this.$refs["leftEcharts7"]);
+      let option = {
+        title: {
+          text: "固定资产进度分布",
+          textStyle: {
+            color: "#fff",
+            fontSize: 28,
+            fontWeight: 500,
+            fontFamily: "Microsoft YaHei",
+          },
+          top: "20",
+          left: "220",
+        },
+        textStyle: {
+          color: "#fff",
+        },
+        tooltip: {
+          show: false,
+          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: function (data) {
+                if (data == "特别监管") {
+                  return "#40A9FF";
+                } else if (data == "备案") {
+                  return "#5BDCC8";
+                }
+              },
+              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: "red",
+              width: 1,
+            },
+          },
+          axisTick: {
+            show: false, //隐藏X轴刻度
+          },
+          axisLabel: {
+            show: true,
+            textStyle: {
+              color: "#fff", //X轴文字颜色
+              fontSize: 20,
+              padding: [-80, 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]
+          },
+        ],
+      };
+      //轮播
+      // tools.loopShowTooltip(leftEcharts1, option, {
+      //   interval: 2000,
+      //   loopSeries: true,
+      // });
+      //注册
+      that.leftEcharts7.setOption(option);
+    },
+    leftEcharts8Fun() {
+      let that = this;
+      this.leftEcharts8 = echarts.init(this.$refs["leftEcharts8"]);
+      let option = {
+        title: {
+          text: "固定资产进度分布",
+          textStyle: {
+            color: "#fff",
+            fontSize: 28,
+            fontWeight: 500,
+            fontFamily: "Microsoft YaHei",
+          },
+          top: "20",
+          left: "220",
+        },
+        textStyle: {
+          color: "#fff",
+        },
+        tooltip: {
+          show: false,
+          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: false,
+            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: "red",
+              width: 1,
+            },
+          },
+          axisTick: {
+            show: false, //隐藏X轴刻度
+          },
+          axisLabel: {
+            show: true,
+            textStyle: {
+              color: "#fff", //X轴文字颜色
+              fontSize: 20,
+              padding: [-80, 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]
+          },
+        ],
+      };
+      //轮播
+      // tools.loopShowTooltip(leftEcharts1, option, {
+      //   interval: 2000,
+      //   loopSeries: true,
+      // });
+      //注册
+      that.leftEcharts8.setOption(option);
+    },
+    chinaEchartsFun () {
+      let that = this
+      this.geoCoordMap = []
+      /*获取地图数据*/
+      this.shanxiMap = echarts.init(this.$refs["shanxi"]);
+      // echarts.registerMap('china', china)
+      echarts.registerMap("china", shanxi);
+      // 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] })
+      // })
+      // var data = [
+      //   { "name": "新疆", value: 29780 },
+      //   { "name": "西藏", value: 2186 },
+      //   { "name": "内蒙古", value: 1135 },
+      //   { "name": "青海", value: 29780 },
+      //   { "name": "四川", value: 2568 },
+      //   { "name": "黑龙江", value: 29780 },
+      //   { "name": "甘肃", value: 6959 },
+      //   { "name": "云南", value: 5632 },
+      //   { "name": "广西", value: 6707 },
+      //   { "name": "湖南", value: 29780 },
+      //   { "name": "陕西", value: 1894 },
+      //   { "name": "广东", value: 15769 },
+      //   { "name": "吉林", value: 8259 },
+      //   { "name": "河北", value: 5741 },
+      //   { "name": "湖北", value: 3030 },
+      //   { "name": "贵州", value: 4542 },
+      //   { "name": "山东", value: 19780 },
+      //   { "name": "江西", value: 3157 },
+      //   { "name": "河南", value: 6690 },
+      //   { "name": "辽宁", value: 8678 },
+      //   { "name": "山西", value: 5303 },
+      //   { "name": "安徽", value: 29780 },
+      //   { "name": "福建", value: 10259 },
+      //   { "name": "浙江", value: 3016 },
+      //   { "name": "江苏", value: 3202 },
+      //   { "name": "重庆", value: 4540 },
+      //   { "name": "宁夏", value: 19780 },
+      //   { "name": "海南", value: 8626 },
+      //   { "name": "台湾", value: 4361 },
+      //   { "name": "北京", value: 20000 },
+      //   { "name": "天津", value: 4080 },
+      //   { "name": "上海", value: 19780 },
+      //   { "name": "香港", value: 6991 },
+      //   { "name": "澳门", value: 13873 },
+      //   { "name": "南海诸岛", value: 0 }
+      // ];
+      // var geoCoordMap = {
+      //   "新疆": [86.9023, 41.148],
+      //   "西藏": [87.8695, 31.6846],
+      //   "内蒙古": [110.5977, 41.3408],
+      //   "青海": [95.2402, 35.4199],
+      //   "四川": [102.9199, 30.1904],
+      //   "黑龙江": [128.1445, 46.7156],
+      //   "甘肃": [102.7129, 38.166],
+      //   "云南": [101.0652, 24.6807],
+      //   "广西": [108.7813, 23.6426],
+      //   "湖南": [111.5332, 27.3779],
+      //   "陕西": [108.5996, 33.7396],
+      //   "广东": [113.8668, 22.8076],
+      //   "吉林": [126.1746, 43.5938],
+      //   "河北": [115.4004, 38.1688],
+      //   "湖北": [112.2363, 30.8572],
+      //   "贵州": [106.6113, 26.6385],
+      //   "山东": [118.2402, 36.2307],
+      //   "江西": [115.7156, 27.99],
+      //   "河南": [113.0668, 33.8818],
+      //   "辽宁": [123.0438, 41.0889],
+      //   "山西": [112.44, 37.73],
+      //   "安徽": [117.2461, 31.0361],
+      //   "福建": [118.3008, 25.9277],
+      //   "浙江": [120.498, 29.0918],
+      //   "江苏": [119.8586, 32.915],
+      //   "重庆": [107.7539, 29.8904],
+      //   "宁夏": [105.9961, 37.1096],
+      //   "海南": [109.9512, 19.2041],
+      //   "台湾": [120.8254, 23.5986],
+      //   "北京": [116.4551, 40.2539],
+      //   "天津": [117.4219, 39.4189],
+      //   "上海": [121.4648, 31.2891],
+      //   "香港": [114.6178, 22.3242],
+      //   "澳门": [113.5547, 21.6484],
+      //   '南海诸岛': [128.8254, 21.5986]
+      // };
+      var data = [
+        { name: "大同市", value: 6035, value2: 28 },
+        { name: "朔州市", value: 3361, value2: 13 },
+        { name: "忻州市", value: 7335, value2: 25 },
+        { name: "吕梁市", value: 10904, value2: 45 },
+        { name: "太原市", value: 25167, value2: 113 },
+        { name: "阳泉市", value: 2512, value2: 28 },
+        { name: "晋中市", value: 14857, value2: 52 },
+        { name: "临汾市", value: 13055, value2: 30 },
+        { name: "长治市", value: 10300, value2: 23 },
+        { name: "运城市", value: 4106, value2: 23 },
+        { name: "晋城市", value: 4543, value2: 31 },
+      ];
+      var geoCoordMap = {
+        太原市: [112.53, 37.87],
+        大同市: [113.3, 40.12],
+        阳泉市: [113.57, 37.85],
+        长治市: [113.08, 36.18],
+        晋城市: [112.83, 35.52],
+        朔州市: [112.43, 39.33],
+        晋中市: [112.94, 37.4],
+        运城市: [110.97, 35.03],
+        忻州市: [112.53, 38.72],
+        临汾市: [111.5, 36.08],
+        吕梁市: [111.13, 37.52],
+      };
+      var convertData = function (data) {
+        var res = [];
+        for (var i = 0; i < data.length; i++) {
+          var geoCoord = geoCoordMap[data[i].name];
+          if (geoCoord) {
+            res.push({
+              name: data[i].name,
+              value: geoCoord.concat(data[i].value),
+            });
+          }
+        }
+        return res;
+      };
+
+      var convertedData = [
+        convertData(data),
+        convertData(
+          data
+            .sort(function (a, b) {
+              return b.value - a.value;
+            })
+            .slice(0, 6)
+        ),
+      ];
+      data.sort(function (a, b) {
+        return a.value - b.value;
+      });
+      option = {
+        // backgroundColor: '#404a59',
+        animation: true,
+        animationDuration: 1000,
+        animationEasing: "cubicInOut",
+        animationDurationUpdate: 1000,
+        animationEasingUpdate: "cubicInOut",
+        geo: {
+          map: "china",
+          center: [112.53, 37.67],
+          zoom: 4.5,
+          label: {
+            emphasis: {
+              show: false,
+            },
+          },
+          tooltip: {
+            trigger: 'item',
+            className: 'custom-tooltip-box',
+            confine: true, // 不超出当前表
+            formatter: function (params) {
+              console.log(params)
+              return `<div class="bgTooltip" style="background: url('../img/shanxi/${params.name}.png') no-repeat center center;background-size: 100% 100%;font-size:36px">
+            <div class="flex items-center">
+              <img src="./img/yellowArrow.png" style="width: 12px;height: 22px;margin-right:10px" alt=""><span class="fb">${params.name}</span>
+            </div>
+              <div class="blueIcon flex items-center">项目数量：<span class="fb" style="color:#68BDFF;">26<span style="font-size:20px" class="fn">个</span></span></div>
+              <div class="blueIcon flex items-center">投资总额：<span class="fb" style="color:#68BDFF">180<span style="font-size:20px" class="fn">亿</span></span></div>
+            </div>`
+            },
+          },
+          roam: false,
+          itemStyle: {
+            normal: {
+              // borderColor: 'rgba(147, 235, 248, 1)',
+              borderColor: '#7fb3ff',
+              borderWidth: 3,
+              areaColor: {
+                type: 'radial',
+                x: 0.5,
+                y: 0.5,
+                r: 0.8,
+                colorStops: [{
+                  offset: 0,
+                  color: '#468ff8' // 0% 处的颜色
+                }, {
+                  offset: 1,
+                  color: '#0a2c6d' // 100% 处的颜色
+                }],
+                globalCoord: false // 缺省为 false
+              },
+              // shadowColor: 'rgba(128, 217, 248, 1)',
+              shadowColor: '#468ff8',
+              shadowOffsetX: -2,
+              shadowOffsetY: 2,
+              shadowBlur: 20
+            },
+            emphasis: {
+              areaColor: {
+                colorStops: [{
+                  offset: 0,
+                  color: '#3844aa' // 0% 处的颜色
+                }, {
+                  offset: 1,
+                  color: '#7284fc' // 100% 处的颜色
+                }],
+              },
+              borderColor: '#b3baff',
+              borderWidth: 5
+            }
+          },
+          // regions: [
+          //   {
+          //     name: "太原市",
+          //     value: 2000,
+          //     itemStyle: {
+          //       emphasis: {
+          //         borderColor: "#ffe036",
+          //         borderWidth: 5,
+          //         areaColor: {
+          //           type: "radial",
+          //           x: 0.5,
+          //           y: 0.5,
+          //           r: 0.8,
+          //           colorStops: [
+          //             {
+          //               offset: 0,
+          //               color: "#ffe036", // 0% 处的颜色
+          //             },
+          //             {
+          //               offset: 1,
+          //               color: "#7c732a", // 100% 处的颜色
+          //             },
+          //           ],
+          //           globalCoord: false, // 缺省为 false
+          //         },
+          //       },
+          //     },
+          //   },
+          //   {
+          //     name: "南海诸岛",
+          //     itemStyle: {
+          //       // 隐藏地图
+          //       normal: {
+          //         opacity: 0, // 为 0 时不绘制该图形
+          //       },
+          //     },
+          //     label: {
+          //       show: false, // 隐藏文字
+          //     },
+          //   },
+          // ],
+        },
+        tooltip: {
+          trigger: "item",
+          className: "custom-tooltip-box",
+          confine: true, // 不超出当前表
+          // formatter: function (params) {
+          //   console.log(params);
+          //   return `<div class="bgTooltip" style="background: url('../img/shanxi/${params.name}.png') no-repeat center center;background-size: 100% 100%;font-size:36px">
+          // <div class="flex items-center">
+          //   <img src="./img/yellowArrow.png" style="width: 12px;height: 22px;margin-right:10px" alt=""><span class="fb">${params.name}</span>
+          // </div>
+          //   <div class="blueIcon flex items-center">项目数量：<span class="fb" style="color:#68BDFF;">26<span style="font-size:20px" class="fn">个</span></span></div>
+          //   <div class="blueIcon flex items-center">投资总额：<span class="fb" style="color:#68BDFF">180<span style="font-size:20px" class="fn">亿</span></span></div>
+          // </div>`;
+          // },
+          formatter: (params, ticket, callback) => {
+            // 清空所有轮播
+            for (var k in this.geoCoordMap) {
+              that.shanxiMap.dispatchAction({
+                // type: 'geoUnSelect',
+                type: 'downplay',
+                name: k,
+              })
+            }
+            // 如果鼠标滑动到线线上面，则返回空
+            that.shanxiMap.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
+            }
+          },
+        },
+        xAxis: {
+          type: "value",
+          scale: true,
+          position: "top",
+          boundaryGap: false,
+          splitLine: {
+            show: false,
+          },
+          axisLine: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLabel: {
+            margin: 2,
+            textStyle: {
+              color: "#aaa",
+            },
+          },
+        },
+        yAxis: {
+          type: "category",
+          nameGap: 16,
+          axisLine: {
+            show: false,
+            lineStyle: {
+              color: "#ddd",
+            },
+          },
+          axisTick: {
+            show: false,
+            lineStyle: {
+              color: "#ddd",
+            },
+          },
+          axisLabel: {
+            interval: 0,
+            textStyle: {
+              color: "#ddd",
+            },
+          },
+          data: categoryData,
+        },
+        series: [
+          {
+            type: 'effectScatter',
+            coordinateSystem: 'geo',
+            data: convertedData[0],
+            symbolSize: function (val) {
+              return Math.max(val[2] / 500, 8);
+            },
+            showEffectOn: "render",
+            rippleEffect: {
+              brushType: "stroke",
+            },
+            hoverAnimation: true,
+            label: {
+              normal: {
+                formatter: "{b}",
+                position: "right",
+                show: true,
+                fontSize: "30",
+                color: "#fff",
+              },
+            },
+            itemStyle: {
+              normal: {
+                color: "#ffc809",
+                shadowBlur: 50,
+                shadowColor: "#ffc809",
+                fontSize: "500",
+              },
+            },
+            zlevel: 999
+          },
+          {
+            type: 'map',
+            map: 'china',
+            // center: [112.53, 37.67],
+            layoutCenter: ['50%', '50%'], //地图位置
+            zoom: 4.5,
+            geoIndex: 1,
+            // aspectScale: 1.5, //长宽比
+            showLegendSymbol: true, // 存在legend时显示
+            label: {
+              normal: {
+                show: true,
+              },
+              emphasis: {
+                show: true,
+                textStyle: {
+                  color: 'red',
+                },
+              },
+            },
+            roam: false,
+            itemStyle: {
+              normal: {
+                // borderColor: 'rgba(147, 235, 248, 1)',
+                borderColor: '#7fb3ff',
+                borderWidth: 3,
+                areaColor: {
+                  type: 'radial',
+                  x: 0.5,
+                  y: 0.5,
+                  r: 0.8,
+                  colorStops: [{
+                    offset: 0,
+                    color: '#468ff8' // 0% 处的颜色
+                  }, {
+                    offset: 1,
+                    color: '#0a2c6d' // 100% 处的颜色
+                  }],
+                  globalCoord: false // 缺省为 false
+                },
+                // shadowColor: 'rgba(128, 217, 248, 1)',
+                shadowColor: '#468ff8',
+                shadowOffsetX: -2,
+                shadowOffsetY: 2,
+                shadowBlur: 20
+              },
+              emphasis: {
+                areaColor: {
+                  colorStops: [{
+                    offset: 0,
+                    color: '#3844aa' // 0% 处的颜色
+                  }, {
+                    offset: 1,
+                    color: '#7284fc' // 100% 处的颜色
+                  }],
+                },
+                borderColor: '#b3baff',
+                borderWidth: 5
+              }
+            },
+            animation: true,
+            data: data,
+          },
+        ]
+      };
+      var categoryData = [];
+      var barData = [];
+      var sum = 0;
+      for (var i = 0; i < data.length; i++) {
+        categoryData.push(data[i].name);
+        barData.push(data[i].value);
+        sum += data[i].value;
+      }
+      // this.shanxiMap.on('click', function (params) {
+      //   if (params.name == '山西') {
+      //     that.shanxiMap.dispose()
+      //     that.centerShow = true
+      //     setTimeout(() => {
+      //     })
+      //   }
+      // })
+      tools.loopShowTooltip(this.shanxiMap, option, {
+        interval: 2000,
+        loopSeries: false,
+      });
+      this.shanxiMap.setOption(option);
+    },
+  },
+});