1

src/view/dialog/dialog.vue

@@ -230,7 +230,6 @@ const handle = (current) => {
 .bo {
   width: 100%;
   display: flex;
-  // align-items: center;
 }
 .title {
   margin: 10px auto;
@@ -243,7 +242,6 @@ const handle = (current) => {
       height: 33px;
       width: 33px;
     }
-
     .name {
       font-family: PangMenZhengDao, PangMenZhengDao;
       font-weight: 600;

src/view/echarts_yl/ylXZZC.vue

@@ -13,7 +13,7 @@ import {
 } from "vue";
 // 局部引入echarts核心模块
 import * as echarts from "echarts";
-
+const emit = defineEmits(["village"]);
 const props = defineProps({
   list1: {
     type: Array,
@@ -217,11 +217,11 @@ const getOption = () => {
         },
         label: {
           show: true,
-        position:'right',
-        color:'#ffffff',
+          position: "right",
+          color: "#ffffff",
           formatter: function (data) {
-          return data.value
-        }
+            return data.value;
+          },
         },
       },
     ],
@@ -261,6 +261,10 @@ const setChart = () => {
   var myChart = echarts.init(chart.value);
   // 使用刚指定的配置项和数据显示图表。
   myChart.setOption(data.option);
+  myChart.on("click", function (params) {
+    console.log(params);
+    emit('village',params.name);
+  });
 };
 // 使用生命钩子
 onBeforeMount(() => {

src/view/yl.vue

@@ -203,7 +203,7 @@
             alt=""
           />
         </div>
-        <ylXZZC :list1="data.zccs1" :list2="data.zccs2"></ylXZZC>
+        <ylXZZC :list1="data.zccs1" :list2="data.zccs2" @village='chooseVillage'></ylXZZC>
       </div>
     </div>
   </div>
@@ -231,6 +231,9 @@ const leftchoose = ref({
 const change = (name, index) => {
   leftchoose.value[name] = index;
 };
+const chooseVillage=(village)=>{
+  console.log(village);
+}
 const data = reactive({
   leftTop1: [],
   leftTop2: [],