Переглянути джерело

完成新水球,压缩弹窗图篇

zhbyyy 2 роки тому
батько
коміт
b2f7899877

BIN
investment/groupImg/light.png


BIN
investment/groupImg/light2.png


BIN
investment/groupImg/titleImg/1.png


BIN
investment/groupImg/titleImg/10.png


BIN
investment/groupImg/titleImg/11.png


BIN
investment/groupImg/titleImg/2.png


BIN
investment/groupImg/titleImg/3.png


BIN
investment/groupImg/titleImg/4.png


BIN
investment/groupImg/titleImg/5.png


BIN
investment/groupImg/titleImg/6.png


BIN
investment/groupImg/titleImg/7.png


BIN
investment/groupImg/titleImg/8.png


BIN
investment/groupImg/titleImg/9.png


+ 16 - 14
investment/investHomeGroup.html

@@ -118,7 +118,8 @@
             </div>
             <div class="h-full w-full overflow-hidden relative commonBack" @click="projectListTipShow = true">
               <div class="total">总额度<span>{{numFormat(left2[1])}}<span style="font-size: 20px;">亿</span></span></div>
-              <div ref="echartL1" style="width: 100%; height: 100%;"></div>
+              <img src="./groupImg/light2.png" class="absolute ballLight" alt="">
+              <div ref="echartL1" style="width: 90%; height: 90%;margin: auto;"></div>
             </div>
           </div>
         </div>
@@ -340,34 +341,35 @@
             <div class="tip2-list">
               <div>
                 <span>2022年度合并报表净利润</span>
-                <span style="color:#4C96CB"><span
-                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[0])}}</span>亿</span>
+                <span style="color:#69c0ff"><span
+                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[0])}}</span>亿</span>
               </div>
               <div>
                 <span>提取固定资产折旧和无形资产摊销</span>
-                <span style="color:#4C96CB"><span
-                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[1])}}</span>亿</span>
+                <span style="color:#69c0ff"><span
+                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[1])}}</span>亿</span>
               </div>
               <div>
                 <span>预计压降带息负债</span>
-                <span style="color:#4C96CB"><span
-                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[2])}}</span>亿</span>
+                <span style="color:#69c0ff"><span
+                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[2])}}</span>亿</span>
               </div>
               <div>
                 <span>已用额度</span>
-                <span style="color:#4C96CB"><span
-                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[3])}}</span>亿</span>
+                <span style="color:#69c0ff"><span
+                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[3])}}</span>亿</span>
               </div>
               <div>
                 <span>剩余额度</span>
-                <span style="color:#4C96CB"><span
-                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[4])}}</span>亿</span>
+                <span style="color:#69c0ff"><span
+                    style="font-size: 20px;font-weight: bold;font-size: 40px;">{{numFormat(common1[4])}}</span>亿</span>
               </div>
             </div>
           </div>
-          <div class="" style="position:relative;width: 100%;height: 100%;" @click="projectListTipShow = true">
-            <div class="total3 total">总额度<span style="font-size: 40px;">{{numFormat(common1[5])}}亿元</span></div>
-            <div ref="echartBall" style="width: 100%; height: 100%;background-color: #04224c;"></div>
+          <div class="" style="position:relative;width: 100%;height: 100%;background-color: #042148;" @click="projectListTipShow = true">
+            <div class="total3 total">总额度:<span style="font-size: 40px;">{{numFormat(common1[5])}}<span style="font-size: 30px;">亿</span></span></div>
+            <img src="./groupImg/light2.png" class="absolute ballLight2" alt="">
+            <div ref="echartBall" style="width: 100%; height: 80%;"></div>
           </div>
         </div>
       </div>

+ 246 - 179
investment/js/investHomeGroup.js

@@ -276,7 +276,7 @@ let app = new Vue({
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -290,7 +290,7 @@ let app = new Vue({
             textStyle: {
               color: "white",
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           //y轴线的颜色以及宽度
@@ -308,7 +308,7 @@ let app = new Vue({
           nameTextStyle: {//y轴上方单位的颜色
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           axisTick: {
             lineStyle: {
@@ -396,7 +396,7 @@ let app = new Vue({
             // 图列内容样式
             color: "#fff", // 字体颜色
             fontSize: "20",
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           right: 'center',
           y: 5,
@@ -433,7 +433,7 @@ let app = new Vue({
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -447,7 +447,7 @@ let app = new Vue({
             textStyle: {
               color: "white",
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           //y轴线的颜色以及宽度
@@ -465,7 +465,7 @@ let app = new Vue({
           nameTextStyle: {//y轴上方单位的颜色
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           axisTick: {
             lineStyle: {
@@ -477,7 +477,7 @@ let app = new Vue({
             textStyle: {
               color: "#fff",
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           splitLine: {
@@ -554,7 +554,7 @@ let app = new Vue({
             // 图列内容样式
             color: "#fff", // 字体颜色
             fontSize: "20",
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           right: 'center',
           y: 0,
@@ -590,7 +590,7 @@ let app = new Vue({
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -604,7 +604,7 @@ let app = new Vue({
             textStyle: {
               color: "#fff",
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           //y轴线的颜色以及宽度
@@ -622,7 +622,7 @@ let app = new Vue({
           nameTextStyle: {//y轴上方单位的颜色
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           axisTick: {
             lineStyle: {
@@ -634,7 +634,7 @@ let app = new Vue({
             textStyle: {
               color: "#fff",
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           splitLine: {
@@ -710,7 +710,7 @@ let app = new Vue({
             // 图列内容样式
             color: "#fff", // 字体颜色
             fontSize: "20",
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           right: 'center',
           y: 5,
@@ -845,153 +845,221 @@ let app = new Vue({
       let myChart = echarts.init(this.$refs['echartBall'])
       var value = common2[0];
       var data = [value];
-      let option = {
-        backgroundColor: 'transparent',
-        title: [
-          {
-            // text: '总额度285.48亿',
-            // formatter: `<span>总额度</span>285.48亿`,
-            x: '37%',
-            y: '80%',
-            textStyle: {
-              fontSize: 24,
-              fontWeight: 'bold',
-              color: '#2CB7E0',
-              lineHeight: 16,
-              textAlign: 'center',
-              fontFamily:'Microsoft YaHei'
-            },
-          }
-        ],
+      option = {
+        backgroundColor: "#042148",
         series: [
           {
-            type: 'liquidFill',
-            radius: '70%',
-            center: ['50%', '40%'],
-            color: [
-              {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
+            type: "liquidFill",
+            radius: "80%",
+            data: [0.45,0.5,0.4],
+            // data: [
+            //   {}
+            // ],
+            backgroundStyle: {
+              color: {
+                type: "radial",
+                x: 0.5,
+                y: 0.5,
+                r: 0.5,
+                // 水球体颜色
                 colorStops: [
                   {
                     offset: 0,
-                    color: '#446bf5',
+                    color: "#010a11",
+                  },
+                  {
+                    offset: 0.75,
+                    color: "#203852",
                   },
                   {
                     offset: 1,
-                    color: '#2ca3e2',
+                    color: "#354e6d",
                   },
                 ],
                 globalCoord: false,
               },
-            ],
-            data: [value, value], // data个数代表波浪数
-            backgroundStyle: {
-              borderWidth: 1,
-              color: 'RGBA(51, 66, 127, 0.7)',
             },
+            outline: {
+              borderDistance: 0,
+              itemStyle: {
+                borderWidth: 0,
+                borderColor: {
+                  type: "linear",
+                  x: 0,
+                  y: 0,
+                  x2: 0,
+                  y2: 1,
+                  colorStops: [
+                  ],
+                  globalCoord: false,
+                },
+              },
+            },
+            color: [
+              {
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0,
+                  color: '#237386',
+                },
+                {
+                  offset: 1,
+                  color: '#0078C8',
+                },],
+              },
+              {
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0,
+                  color: '#2F97A9',
+                },
+                {
+                  offset: 1,
+                  color: '#0078C8',
+                },],
+              },
+              {
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0,
+                  color: '#48E0ED',
+                },
+                {
+                  offset: 1,
+                  color: '#0078C8',
+                },],
+              }
+            ],
             label: {
               normal: {
-                formatter: function (data) {
-                  return (data.value * 100).toFixed(2) + '%'
-                },
                 textStyle: {
-                  fontSize: 30,
-                  color: '#fff',
-                  fontFamily:'Microsoft YaHei'
+                  color: "#fff", // x轴文字颜色
+                  fontSize:'70'
                 },
               },
             },
-            outline: {
-              // show: false
-              borderDistance: 0,
-              itemStyle: {
-                borderWidth: 2,
-                borderColor: 'transparent',
-              },
-            },
           },
         ],
-      }
+      };
       myChart.setOption(option)
     },
     initChartL1 () {
       let myChart = echarts.init(this.$refs['echartL1'])
       var value = left2[0];
-      let option = {
-        backgroundColor: 'transparent',
-        title: [
-          {
-            // text: '总额度285.48亿',
-            // formatter: `<span>总额度</span>285.48亿`,
-            x: '37%',
-            y: '80%',
-            textStyle: {
-              fontSize: 24,
-              fontWeight: 'bold',
-              color: '#2CB7E0',
-              lineHeight: 16,
-              textAlign: 'center',
-              fontFamily:'Microsoft YaHei'
-            },
-          }
-        ],
+      option = {
+        backgroundColor: "#042148",
         series: [
           {
-            type: 'liquidFill',
-            radius: '70%',
-            center: ['50%', '40%'],
-            color: [
-              {
-                type: 'linear',
-                x: 0,
-                y: 0,
-                x2: 0,
-                y2: 1,
+            type: "liquidFill",
+            radius: "80%",
+            data: [0.45,0.5,0.4],
+            // data: [
+            //   {}
+            // ],
+            backgroundStyle: {
+              color: {
+                type: "radial",
+                x: 0.5,
+                y: 0.5,
+                r: 0.5,
+                // 水球体颜色
                 colorStops: [
                   {
                     offset: 0,
-                    color: '#446bf5',
+                    color: "#010a11",
+                  },
+                  {
+                    offset: 0.75,
+                    color: "#203852",
                   },
                   {
                     offset: 1,
-                    color: '#2ca3e2',
+                    color: "#354e6d",
                   },
                 ],
                 globalCoord: false,
               },
-            ],
-            data: [value, value], // data个数代表波浪数
-            backgroundStyle: {
-              borderWidth: 1,
-              color: 'RGBA(51, 66, 127, 0.7)',
             },
+            outline: {
+              borderDistance: 0,
+              itemStyle: {
+                borderWidth: 0,
+                borderColor: {
+                  type: "linear",
+                  x: 0,
+                  y: 0,
+                  x2: 0,
+                  y2: 1,
+                  colorStops: [
+                  ],
+                  globalCoord: false,
+                },
+              },
+            },
+            color: [
+              {
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0,
+                  color: '#237386',
+                },
+                {
+                  offset: 1,
+                  color: '#0078C8',
+                },],
+              },
+              {
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0,
+                  color: '#2F97A9',
+                },
+                {
+                  offset: 1,
+                  color: '#0078C8',
+                },],
+              },
+              {
+                x: 0,
+                y: 0,
+                x2: 0,
+                y2: 1,
+                colorStops: [{
+                  offset: 0,
+                  color: '#48E0ED',
+                },
+                {
+                  offset: 1,
+                  color: '#0078C8',
+                },],
+              }
+            ],
             label: {
               normal: {
-                formatter: function (data) {
-                  return (data.value * 100).toFixed(2) + '%'
-                },
                 textStyle: {
-                  fontSize: 30,
-                  color: '#fff',
-                  fontFamily:'Microsoft YaHei'
+                  color: "#fff", // x轴文字颜色
                 },
               },
             },
-            outline: {
-              // show: false
-              borderDistance: 0,
-              itemStyle: {
-                borderWidth: 2,
-                borderColor: 'transparent',
-              },
-            },
           },
         ],
-      }
+      };
+
       myChart.setOption(option)
     },
     initChartL2 () {
@@ -1002,7 +1070,7 @@ let app = new Vue({
       let that = this
 
       var option = {
-        colors: ['#5783ab', '#1a5389', '#a79c57', '#cc8c29', '#91a65f', '#383062', '#034a39'],
+       colors: ['#a79c57', '#cc8c29', '#91a65f', '#e1d7da', '#383062', '#034a39','#b48494','#85868b'],
         chart: {
           type: 'pie',
           backgroundColor: 'rgba(0,0,0,0)',
@@ -1117,7 +1185,7 @@ let app = new Vue({
           style: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: function (e) {
             let num = chartData[this.colorIndex].num
@@ -1246,7 +1314,7 @@ let app = new Vue({
 
       let that = this
       var chart = Highcharts.chart('echartL3', {
-        colors: ['#5783ab', '#1a5389', '#a79c57', '#cc8c29', '#91a65f', '#383062', '#034a39'],
+       colors: ['#a79c57', '#cc8c29', '#91a65f', '#e1d7da', '#383062', '#034a39','#b48494','#85868b'],
         chart: {
           type: 'pie',
           backgroundColor: 'rgba(0,0,0,0)',
@@ -1360,7 +1428,7 @@ let app = new Vue({
           style: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: function (e) {
             //console.log(this)
@@ -1500,7 +1568,7 @@ let app = new Vue({
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -1514,7 +1582,7 @@ let app = new Vue({
             textStyle: {
               color: "white",
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           //y轴线的颜色以及宽度
@@ -1539,7 +1607,7 @@ let app = new Vue({
             textStyle: {
               color: "white",
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           splitLine: {
@@ -1562,7 +1630,7 @@ let app = new Vue({
           nameTextStyle: {
             color: '#fff',
             fontSize: 20,
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         series: [
@@ -1598,9 +1666,9 @@ let app = new Vue({
             // 图列内容样式
             color: "#fff", // 字体颜色
             fontSize: "20",
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
-          right:'center',
+          right: 'center',
           y: 5,
           // icon: "roundRect",
           // 小图标的宽高
@@ -1628,7 +1696,7 @@ let app = new Vue({
       let that = this
 
       var option = {
-        colors: ['#5783ab', '#1a5389', '#a79c57', '#cc8c29', '#91a65f', '#383062', '#034a39'],
+       colors: ['#a79c57', '#cc8c29', '#91a65f', '#e1d7da', '#383062', '#034a39','#b48494','#85868b'],
         chart: {
           type: 'pie',
           backgroundColor: 'rgba(0,0,0,0)',
@@ -1725,7 +1793,7 @@ let app = new Vue({
           style: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: function (e) {
             //console.log(this)
@@ -1839,7 +1907,7 @@ let app = new Vue({
       let that = this
 
       var option = {
-        colors: ['#5783ab', '#1a5389', '#a79c57', '#cc8c29', '#91a65f', '#383062', '#034a39', '#5783ab'],
+        colors: ['#a79c57', '#cc8c29', '#91a65f', '#e1d7da', '#383062', '#034a39','#b48494','#85868b'],
         chart: {
           type: 'pie',
           backgroundColor: 'rgba(0,0,0,0)',
@@ -1936,7 +2004,7 @@ let app = new Vue({
           style: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: function (e) {
             //console.log(this)
@@ -2049,7 +2117,7 @@ let app = new Vue({
       let that = this
 
       var option = {
-        colors: ['#5783ab', '#1a5389', '#a79c57', '#cc8c29', '#91a65f', '#383062', '#034a39'],
+        colors: ['#a79c57', '#cc8c29', '#91a65f', '#e1d7da', '#383062', '#034a39','#b48494','#85868b'],
         chart: {
           type: 'pie',
           backgroundColor: 'rgba(0,0,0,0)',
@@ -2146,7 +2214,7 @@ let app = new Vue({
           style: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: function (e) {
             //console.log(this)
@@ -2260,7 +2328,7 @@ let app = new Vue({
       let that = this
 
       var option = {
-        colors: ['#5783ab', '#1a5389', '#a79c57', '#cc8c29', '#91a65f', '#383062', '#034a39'],
+       colors: ['#a79c57', '#cc8c29', '#91a65f', '#e1d7da', '#383062', '#034a39','#b48494','#85868b'],
         chart: {
           type: 'pie',
           backgroundColor: 'rgba(0,0,0,0)',
@@ -2357,7 +2425,7 @@ let app = new Vue({
           style: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: function (e) {
             //console.log(this)
@@ -2497,7 +2565,7 @@ let app = new Vue({
             textStyle: {
               color: '#fff', //X轴文字颜色
               fontSize: 20,
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         },
@@ -2520,13 +2588,13 @@ let app = new Vue({
               textStyle: {
                 color: '#fff',
                 fontSize: 20,
-                fontFamily:'Microsoft YaHei'
+                fontFamily: 'Microsoft YaHei'
               },
             },
             nameTextStyle: {
               color: '#ebf8ac',
               fontSize: 16,
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         ],
@@ -2636,7 +2704,7 @@ let app = new Vue({
           textStyle: {
             color: '#ffffff',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           axisPointer: {
             lineStyle: {
@@ -2678,7 +2746,7 @@ let app = new Vue({
           nameTextStyle: {
             color: '#ebf8ac',
             fontSize: 16,
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -2788,7 +2856,7 @@ let app = new Vue({
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           axisPointer: {
             lineStyle: {
@@ -2829,7 +2897,7 @@ let app = new Vue({
           nameTextStyle: {
             color: '#ebf8ac',
             fontSize: 16,
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -2997,7 +3065,7 @@ let app = new Vue({
           style: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: function (e) {
             //console.log(this, e)
@@ -3118,7 +3186,6 @@ let app = new Vue({
           data: chartData
         }]
       });
-
       function autoTooltip (point) {
         chart.tooltip.refresh(point);
       }
@@ -3160,12 +3227,12 @@ let app = new Vue({
           },
           trigger: 'axis',
           axisPointer: {
-             // type: 'cross',',
+            // type: 'cross',',
           },
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         dataZoom: [
@@ -3211,7 +3278,7 @@ let app = new Vue({
           textStyle: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -3232,7 +3299,7 @@ let app = new Vue({
             textStyle: {
               color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         },
@@ -3258,13 +3325,13 @@ let app = new Vue({
               textStyle: {
                 color: '#fff',
                 fontSize: '20',
-                fontFamily:'Microsoft YaHei'
+                fontFamily: 'Microsoft YaHei'
               },
             },
             nameTextStyle: {
               color: '#fff',
               fontSize: 20,
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         ],
@@ -3576,7 +3643,7 @@ let app = new Vue({
                 formatter: '{b}',
                 position: [10, 10],
                 fontSize: 30,
-                fontFamily:'Microsoft YaHei',
+                fontFamily: 'Microsoft YaHei',
                 fontWeight: 600,
                 fontStyle: 'italic',
                 color: '#fff',
@@ -3905,7 +3972,7 @@ let app = new Vue({
                 formatter: '{b}',
                 position: [10, 10],
                 fontSize: 20,
-                fontFamily:'Microsoft YaHei',
+                fontFamily: 'Microsoft YaHei',
                 fontWeight: 600,
                 // fontStyle: 'italic',
                 color: '#fff',
@@ -4040,12 +4107,12 @@ let app = new Vue({
           trigger: 'axis',
           formatter: '{a0}:{c0}' + '亿元',  //+ '<br/>'+ '{a1}:{c1}' + '%',
           axisPointer: {
-             // type: 'cross',',
+            // type: 'cross',',
           },
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         grid: {
@@ -4078,7 +4145,7 @@ let app = new Vue({
             textStyle: {
               color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         },
@@ -4104,13 +4171,13 @@ let app = new Vue({
               textStyle: {
                 color: '#fff',
                 fontSize: '20',
-                fontFamily:'Microsoft YaHei'
+                fontFamily: 'Microsoft YaHei'
               },
             },
             nameTextStyle: {
               color: '#fff',
               fontSize: 20,
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           {
@@ -4270,7 +4337,7 @@ let app = new Vue({
           style: {
             color: '#fff',
             fontSize: '20',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: function (e) {
             //console.log(this)
@@ -4451,11 +4518,11 @@ let app = new Vue({
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           trigger: 'axis',
           axisPointer: {
-             // type: 'cross',',
+            // type: 'cross',',
           },
         },
         dataZoom: [
@@ -4502,7 +4569,7 @@ let app = new Vue({
           textStyle: {
             color: '#fff',
             fontSize: "20",
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -4523,7 +4590,7 @@ let app = new Vue({
             textStyle: {
               color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
               fontSize: "20",
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         },
@@ -4552,13 +4619,13 @@ let app = new Vue({
               textStyle: {
                 color: '#fff',
                 fontSize: "20",
-                fontFamily:'Microsoft YaHei'
+                fontFamily: 'Microsoft YaHei'
               },
             },
             nameTextStyle: {
               color: '#fff',
               fontSize: 20,
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         ],
@@ -4750,7 +4817,7 @@ let app = new Vue({
           textStyle: {
             fontSize: 20,
             color: '#fff',
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           }
         },
         textStyle: {
@@ -4762,7 +4829,7 @@ let app = new Vue({
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           formatter: data => {
             return `${data[0].value[0]}<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[0].color}"></span> ${data[0].seriesName}:${data[0].data[1]}亿<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[1].color}"></span> ${data[1].seriesName}:${data[1].data[1]}亿<br /><span style="display:inline-block;border-radius:50%; width:7px;height:7px;background-color:${data[2].color}"></span> ${data[2].seriesName}:${data[2].data[1]}亿`
@@ -4795,13 +4862,13 @@ let app = new Vue({
             textStyle: {
               color: '#fff',
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
           nameTextStyle: {
             color: '#fff',
             fontSize: 20,
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -4830,7 +4897,7 @@ let app = new Vue({
             textStyle: {
               color: '#fff', //X轴文字颜色
               fontSize: 20,
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         },
@@ -4915,7 +4982,7 @@ let app = new Vue({
           },
           trigger: 'axis',
           axisPointer: {
-             // type: 'cross',',
+            // type: 'cross',',
           },
           position: (params) => {
             return [params[0] + 10, 60]
@@ -4923,7 +4990,7 @@ let app = new Vue({
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
           confine: true
         },
@@ -4972,7 +5039,7 @@ let app = new Vue({
             // color: 'rgba(250,250,250,0.6)',
             color: '#fff',
             fontSize: "20",
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -4993,7 +5060,7 @@ let app = new Vue({
             textStyle: {
               color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         },
@@ -5022,13 +5089,13 @@ let app = new Vue({
               textStyle: {
                 color: '#fff',
                 fontSize: '20',
-                fontFamily:'Microsoft YaHei'
+                fontFamily: 'Microsoft YaHei'
               },
             },
             nameTextStyle: {
               color: '#fff',
               fontSize: 20,
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         ],
@@ -5137,7 +5204,7 @@ let app = new Vue({
             textStyle: {
               color: "#fff",
               fontSize: '20',
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             }
           },
           splitNumber: 4, //有几个圈
@@ -5209,12 +5276,12 @@ let app = new Vue({
           },
           trigger: 'axis',
           axisPointer: {
-             // type: 'cross',',
+            // type: 'cross',',
           },
           textStyle: {
             color: '#FFF',     // 文字的颜色
             fontSize: '20',    // 文字字体大小
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         grid: {
@@ -5231,7 +5298,7 @@ let app = new Vue({
             // color: 'rgba(250,250,250,0.6)',
             color: '#fff',
             fontSize: "20",
-            fontFamily:'Microsoft YaHei'
+            fontFamily: 'Microsoft YaHei'
           },
         },
         xAxis: {
@@ -5252,7 +5319,7 @@ let app = new Vue({
             textStyle: {
               color: '#fff',//'rgba(255,255,255,0.6)', //X轴文字颜色
               fontSize: '20',    // 文字字体大小
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         },
@@ -5281,13 +5348,13 @@ let app = new Vue({
               textStyle: {
                 color: '#fff',
                 fontSize: '20',    // 文字字体大小
-                fontFamily:'Microsoft YaHei'
+                fontFamily: 'Microsoft YaHei'
               },
             },
             nameTextStyle: {
               color: '#fff',
               fontSize: 20,
-              fontFamily:'Microsoft YaHei'
+              fontFamily: 'Microsoft YaHei'
             },
           },
         ],

+ 19 - 3
investment/styles/investHomeGroup.css

@@ -203,10 +203,11 @@ div {
   height: 40px;
   position: absolute;
   left: calc(50% - 130px);
-  bottom: 7%;
+  bottom: 5%;
   font-weight: bold;
-  color: #2cb7e0;
+  color: #69c0ff;
   font-size: 30px;
+  z-index: 999 !important;
 }
 .LeftBox .commonBack,
 .RightBox .commonBack {
@@ -744,7 +745,8 @@ div {
   bottom: 15%;
   font-size: 30px;
   font-weight: bold;
-  color: #2cb7e0;
+  color: #69c0ff;
+  z-index: 999;
 }
 .productTip{
   /* height: ; */
@@ -762,6 +764,20 @@ div {
 .productTip .row-item,.productTip .header-item{
   font-size: 30px !important;
 }
+.ballLight{
+  width: 110px;
+  height: auto;
+  z-index: 999 !important;
+  left: 170px;
+  top: 80px;
+}
+.ballLight2{
+  width: 150px;
+  height: auto;
+  z-index: 999 !important;
+  left: 170px;
+  top: 190px;
+}
 /* 公共css */
 /* 宽高纵横比 */
 i{