From af0133d16e452cefbe09a8aca8ad807a9b49dfe1 Mon Sep 17 00:00:00 2001
From: lnn19986213 <1667908750@qq.com>
Date: Fri, 14 Jun 2024 10:46:56 +0800
Subject: [PATCH] gx

---
 src/assets/images/sjfx/mtNum.png    | Bin 0 -> 2337 bytes
 src/assets/images/sjfx/mtNum2.png   | Bin 0 -> 1971 bytes
 src/view/analyze.vue                |  90 +++++++++++++++++++++++-----
 src/view/echart_analyze/pie3dMt.vue |  73 +++++++++++++---------
 4 files changed, 118 insertions(+), 45 deletions(-)
 create mode 100644 src/assets/images/sjfx/mtNum.png
 create mode 100644 src/assets/images/sjfx/mtNum2.png

diff --git a/src/assets/images/sjfx/mtNum.png b/src/assets/images/sjfx/mtNum.png
new file mode 100644
index 0000000000000000000000000000000000000000..fc19a0386ffd9df29076d7970387ff37f9089fc7
GIT binary patch
literal 2337
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
Hu0mjf-DEpl

literal 0
HcmV?d00001

diff --git a/src/assets/images/sjfx/mtNum2.png b/src/assets/images/sjfx/mtNum2.png
new file mode 100644
index 0000000000000000000000000000000000000000..8c5c5c0bf3965596cc961cc74e7bbb9ec66beb00
GIT binary patch
literal 1971
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
FV1g#Oc(4Ef

literal 0
HcmV?d00001

diff --git a/src/view/analyze.vue b/src/view/analyze.vue
index 91c215f..d0f23df 100644
--- a/src/view/analyze.vue
+++ b/src/view/analyze.vue
@@ -18,7 +18,14 @@
             <i></i>
           </div>
         </div>
-
+        <div class="minTopTitle"></div>
+        <div class="minTopNum">
+          <div class="numItem" v-for="(item,inex) in minData.minTop" :key="index">{{ item }}</div>
+        </div>
+        <!-- <div class="minPie">
+          <Pie3dMt :list="minData.minPieData1"></Pie3dMt>
+        </div> -->
+        
       </div>
       <div class="flex1">
         <div class="yd_title center_1">
@@ -59,9 +66,22 @@
 </template>
 
 <script setup>
+import Pie3dMt from "./echart_analyze/pie3dMt.vue";
 import { ref, reactive, onMounted, onBeforeMount, computed } from "vue";
 import http from "@/utils/request.js";
 
+const minData = reactive({
+  minTop: ['4','9','1','6','2','人'],
+  minPieData1: {
+    wfgz:"1500",
+    xstp:"1610",
+    skym:"1610",
+    xxdc:"1610",
+    dzzh:"1610",
+    zq:"1610",
+  }
+})
+
 onMounted(() => {
 
 });
@@ -131,9 +151,6 @@ onBeforeMount(() => {
   background-size: 100% 100%;
 }
 
-
-
-
 .center_0 {
   background-image: url(@/assets/images/sjfx/bft.png);
   background-repeat: no-repeat;
@@ -163,10 +180,6 @@ onBeforeMount(() => {
   background-size: 100% 100%;
 }
 
-
-
-
-
 .yd_title {
   box-sizing: border-box;
   width: 98%;
@@ -289,8 +302,6 @@ onBeforeMount(() => {
     bottom: 100%;
   }
 }
-
-
 .mechanism {
   background-image: url(@/assets/YLTitle/titleImg10.png);
   background-repeat: no-repeat;
@@ -301,12 +312,6 @@ onBeforeMount(() => {
   padding: 12px 0;
 }
 
-
-
-
-
-
-
 /* 滚动条整体部分 */
 .rolling::-webkit-scrollbar {
   width: 5px;
@@ -327,4 +332,57 @@ onBeforeMount(() => {
   background: rgba(0, 162, 231, 1);
   -webkit-box-shadow: inset 0 0 6px rgba(20, 20, 20, 0.3);
 }
+
+.minTopTitle {
+  width: 100%;
+  height: 28px;
+  background-image: url(@/assets/images/sjfx/yjj.png);
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  margin: 4px auto;
+  margin-top: 25px;
+}
+.minTopNum {
+  width: 100%;
+  height: 120px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  .numItem {
+    width: 72px;
+    height: 114px;
+    text-align: center;
+    line-height: 114px;
+    font-weight: 400;
+    font-size: 60px;
+    margin: 0 3px;
+    color: #ffffff;
+    text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
+    background-image: url(@/assets/images/sjfx/mtNum.png);
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+  }
+  .numItem:last-child {
+    width: 72px;
+    height: 114px;
+    text-align: center;
+    line-height: 114px;
+    font-weight: 400;
+    font-size: 36px;
+    margin: 0 3px;
+    color: #ffffff;
+    text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
+    background-image: url(@/assets/images/sjfx/mtNum2.png);
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+  }
+}
+.minPie{
+  width: 100%;
+  position: relative;
+  margin: -10px 0;
+  .minPieImg{
+
+  }
+}
 </style>
diff --git a/src/view/echart_analyze/pie3dMt.vue b/src/view/echart_analyze/pie3dMt.vue
index 1b20e1b..5151c90 100644
--- a/src/view/echart_analyze/pie3dMt.vue
+++ b/src/view/echart_analyze/pie3dMt.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     ref="chart"
-    style="width: 100%; height: 250px"
+    style="width: 100%; height: 240px"
   ></div>
 </template>
 
@@ -20,17 +20,14 @@ import "echarts-gl";
 
 const props = defineProps({
   list: {
-    type: Array,
-    default: () => {
-      return [];
-    },
+    type: Object,
   },
 });
 
 const chart = ref(); // 创建DOM引用
 
 const data = reactive({
-  list: [],
+  list: {},
   //   pieData: [
   //     {
   //       name: "61-70岁", //名称
@@ -71,12 +68,34 @@ const colorList = [
 
 const pieData = reactive([
   {
-    name: "高血压", //名称
+    name: "危房改造", //名称
     value: 0, //值
+    per: 2,
   },
   {
-    name: "非高血压",
+    name: "下山脱贫",
     value: 0,
+    per: 8,
+  },
+  {
+    name: "水库移民",
+    value: 0,
+    per: 10,
+  },
+  {
+    name: "小县大城",
+    value: 0,
+    per: 43,
+  },
+  {
+    name: "地质灾害",
+    value: 0,
+    per: 15,
+  },
+  {
+    name: "征迁",
+    value: 0,
+    per: 22,
   },
 ]);
 
@@ -226,14 +245,15 @@ function getPie3D(pieData, internalDiameterRatio) {
         "#F4BB29",
         "#49C384",
       ],
-      width: "40%",
+      // width: "40%",
+      height: '40%',
       //图例列表的布局朝向。
       orient: "vertical",
       right: 20,
       top: "center",
       //图例文字每项之间的间隔
       itemGap: 10,
-      show: false,
+      show: true,
       icon: "rect",
       itemHeight: 10,
       itemWidth: 25,
@@ -249,16 +269,11 @@ function getPie3D(pieData, internalDiameterRatio) {
         var target;
         for (var i = 0, l = pieData.length; i < l; i++) {
           if (pieData[i].name == name) {
-            target = pieData[i].value;
+            target = pieData[i].per;
           }
         }
-        if (name == "91-100岁") {
-          return `   ${name}           ${target} 人`;
-        } else if (name == "100岁以上") {
-          return `   ${name}          ${target} 人`;
-        } else {
-          return `   ${name}             ${target} 人`;
-        }
+
+        return `${name}：${target}%`;
       },
     },
     //移动上去提示的文本内容
@@ -296,14 +311,14 @@ function getPie3D(pieData, internalDiameterRatio) {
         rotateSensitivity: 0, //设置为0无法旋转
         zoomSensitivity: 0, //设置为0无法缩放
         panSensitivity: 0, //设置为0无法平移
-        alpha: 25, //角度(这个很重要 调节角度的)
+        alpha: 20, //角度(这个很重要 调节角度的)
         distance: 100, //调整视角到主体的距离，类似调整zoom(这是整体大小)
       },
-      top: "-30",
-      left: "-120",
+      top: "-10",
+      left: "-160",
       width: "100%",
       show: false,
-      boxHeight: 20,
+      boxHeight: 16,
     },
     series: series,
   };
@@ -550,13 +565,13 @@ const setChart = () => {
 // 使用生命钩子
 onBeforeMount(() => {
   setTimeout(() => {
-    // data.list = props.list;
-    data.list = {
-      gxy:"1500",
-      notGxy:"1610",
-    }
-    pieData[0].value = data.list.gxy;
-    pieData[1].value = data.list.notGxy;
+    data.list = props.list;
+    pieData[0].value = data.list.wfgz;
+    pieData[1].value = data.list.xstp;
+    pieData[2].value = data.list.skym;
+    pieData[3].value = data.list.xxdc;
+    pieData[4].value = data.list.dzzh;
+    pieData[5].value = data.list.zq;
 
     getOption();
     setChart();