人房概览房屋概览饼图点击中心点展示占比

src/views/dataBoard/renfang/cpts/fwPieOption.js

@@ -17,6 +17,7 @@ export function pieOption() {
         fontSize: 12,
         color: '#A3B9DA'
       },
+      triggerEvent: true,
     },
     tooltip: {
       show: false,

src/views/dataBoard/renfang/cpts/fwgl.vue

@@ -202,12 +202,24 @@ export default {
         {value: pandectData.rentOut, name: "出租"},
         {value: pandectData.vacantHouse, name: "闲置"},
       ];
+      const temp = [...this.pieData,{value:pandectData.homeCount, name: "总数"}]
       this.pieOption.series[0].data = this.pieData;
       console.log(this.pieOption, 'this.pieOption.series')
       this.$refs.pieChart.setOption(this.pieOption);
+      let than = this
+      let currentIndex = 0; 
         //饼状图点击事件
       this.$refs.pieChart.myChart.off('click').on('click', (param) =>{  //这里使用箭头函数代替function，this指向VueComponent
-          let index;
+        currentIndex = (currentIndex + 1) %temp.length;
+        const currentData =temp[currentIndex];
+        const percentage = ((currentData.value /  pandectData.homeCount) * 100).toFixed(2);
+        than.$refs.pieChart.myChart.setOption({
+          title: {
+            text:currentData.name == '总数'?pandectData.homeCount: `${percentage}%`,
+            subtext: currentData.name,
+          }
+        });
+        let index;
           //当前扇区的dataIndex
           index = param.dataIndex;
           //自己的操作，这里是点击跳转路由，并携带参数

src/views/dataBoard/renfang/cpts/jmPieOption.js

@@ -18,6 +18,7 @@ export function pieOption() {
                 fontSize: 12,
                 color: '#A3B9DA'
             },
+            triggerEvent: true,
         },
         tooltip: {
             show: false,

src/views/dataBoard/renfang/cpts/jmgl.vue

@@ -195,7 +195,19 @@ export default {
       this.pieOption.series[0].data = this.pieData;
       this.$refs.pieChart.setOption(this.pieOption);
       this.$refs.pieChart.myChart.setOption(this.pieOption);
+      const temp = [...this.pieData,{value:pandectData.totalResidents, name: "总数"}]
+      let than = this
+      let currentIndex = 0; 
       this.$refs.pieChart.myChart.off('click').on('click', (param) =>{  //这里使用箭头函数代替function，this指向VueComponent
+        currentIndex = (currentIndex + 1) %temp.length;
+        const currentData =temp[currentIndex];
+        const percentage = ((currentData.value /  pandectData.totalResidents) * 100).toFixed(2);
+        than.$refs.pieChart.myChart.setOption({
+          title: {
+            text:currentData.name == '总数'?pandectData.totalResidents: `${percentage}%`,
+            subtext: currentData.name,
+          }
+        });
         let index;
         //当前扇区的dataIndex
         index = param.dataIndex;