轮播数据

investment/investHome2.html

@@ -18,6 +18,8 @@
   <script src="./js/request.js"></script>
   <script src="./libs/echarts-liquidfill.min.js"></script>
   <script src="./libs/echarts-tooltip-carousel.js"></script>
+  <script src="./js/data2.js"></script>
+
   <!-- 轮播 -->
   <link rel="stylesheet" href="https://unpkg.com/swiper@8/swiper-bundle.css" />
   <link rel="stylesheet" href="https://unpkg.com/swiper@8/swiper-bundle.min.css" />

investment/js/data2.js

@@ -1,3 +1,15 @@
-let lbList = [
-  []
+let dataList = [
+  [[6.41, 30.93, 4.74, 37.74, 11.19], [8.61, 34.87, 29.28, 32.30, 12.82], [9.57, 32.90, 5.78, 40.89, 12.45]],
+  [[3.02, 25.82, 23.03, 41.55, 5.11], [4.06, 29.12, 24.45, 35.57, 5.85], [4.51, 27.47, 28.09, 45.02, 5.68]],
+  [[15.87, 0.32, 43.08, 31.79, 19.33], [21.32, 0.36, 0.30, 27.21, 22.15], [23.69, 0.34, 52.54, 34.44, 21.50]],
+  [[7.16, 22.31, 25.51, 0.66, 12.17], [9.61, 25.15, 21.12, 0.56, 13.95], [10.68, 23.73, 31.11, 0.71, 13.54]],
+  [[6.87, 17.94, 11.04, 36.47, 8.32], [9.23, 20.22, 16.98, 31.21, 9.53], [10.25, 19.08, 13.46, 39.51, 9.25]],
+  [[20.59, 14.80, 15.56, 21.25, 13.52], [27.66, 16.68, 14.01, 18.19, 15.50], [30.73, 15.74, 18.98, 23.02, 15.05]],
+  [[16.68, 32.06, 21.10, 6.22, 12.19], [22.41, 36.16, 30.36, 5.32, 13.97], [24.90, 34.11, 25.73, 6.74, 13.56]],
+  [[4.24, 15.54, 23.05, 4.00, 23.28], [5.70, 17.52, 14.71, 3.42, 26.68], [6.33, 16.53, 28.11, 4.33, 25.90]],
+  [[16.13, 0.85, 11.82, 11.62, 16.54], [21.67, 0.95, 0.80, 9.95, 18.95], [24.08, 0.90, 14.41, 12.59, 18.40]],
+  [[5.71, 1.25, 5.95, 5.62, 19.78], [7.67, 1.41, 1.18, 4.81, 22.66], [8.52, 1.33, 7.25, 6.09, 22.00]],
+  [[5.07, 19.76, 11.03, 32.29, 7.42], [6.80, 22.28, 18.71, 27.63, 8.50], [7.56, 21.02, 13.45, 34.98, 8.25]],
+  [[15.40, 24.98, 9.76, 2.57, 25.15], [20.68, 28.16, 23.65, 2.20, 28.82], [22.98, 26.57, 11.90, 2.78, 27.98]],
+  [[6.46, 17.88, 35.68, 27.07, 14.77], [8.68, 20.16, 16.93, 23.17, 16.92], [9.64, 19.02, 43.51, 29.33, 16.43]],
 ]

investment/js/investHome2.js

@@ -2,9 +2,11 @@ let app = new Vue({
   el: '#app',
   data () {
     return {
+      count: 1,
       type: true, // 切换柱状图状态
       showTip2: false,
       showTip3: false,
+      timer2: '',
       echartTitle: '',
       year: '2022',
       time: '',
@@ -71,11 +73,21 @@ let app = new Vue({
     this.timer = setInterval(() => {
       this.time = formatDate()
     }, 1000)
+    this.timer2 = setInterval(() => {
+      if (this.count < dataList.length) {
+        this.count++
+      } else {
+        this.count = 1
+      }
+      this.initChartL3()
+    }, 2000)
   },
+
   beforeDestroy () {
     if (this.timer) {
       clearInterval(this.timer);
     }
+    this.timer2 && clearInterval(this.timer2);
   },
   mounted () {
     // 左侧图表
@@ -107,10 +119,6 @@ let app = new Vue({
         swiper.autoplay.start();
       }
     })
-    setInterval(() => {
-      this.type = !this.type
-      this.initChartL3()
-    }, 2000)
   },
   methods: {
     convertData (data) {
@@ -941,7 +949,8 @@ let app = new Vue({
                 ]),
               },
             },
-            data: [70, 52, 33, 41, 52],
+            // data: [70, 52, 33, 41, 52],
+            data: dataList[this.count][0]
             // markLine: {
             //   symbol: ['none', 'none'],
             //   data: [
@@ -995,7 +1004,8 @@ let app = new Vue({
                 ]),
               },
             },
-            data: [20, 30, 15, 28, 36],
+            // data: [20, 30, 15, 28, 36],
+            data: dataList[this.count][1]
           },
           {
             name: '',
@@ -1015,7 +1025,8 @@ let app = new Vue({
                 ]),
               },
             },
-            data: [15, 22, 17, 33, 14],
+            // data: [15, 22, 17, 33, 14],
+            data: dataList[this.count][2]
           },
         ],
       }