lcw

src/views/recruitment/card/EnterpriseEmploymentTwo.vue

@@ -9,114 +9,94 @@ import { ref, reactive, computed, onMounted } from "vue";
 import * as echarts from "echarts";
 const enterpriseTwoRef = ref(null);
 const option = {
+  // 添加标题
+  title: {
+    text: '重点保供企业分布',
+    left: 'center',
+    top: '5%',
+    textStyle: {
+      color: '#30DCFF',
+      fontSize: 16,
+      fontWeight: 'normal'
+    }
+  },
   // 设置图形位置
   grid: {
-    top: "15%",
+    top: '20%',
-    left: "15%",
+    left: '15%',
-    right: "5%",
+    right: '5%',
-    bottom: "20%"
+    bottom: '25%'
-  },
-  // 设置图例
-  legend: {
-    itemWidth: 10, // 方块宽度
-    itemHeight: 10, // 方块高度
-    textStyle: {
-      color: "#B2D9DF" // 文字颜色
-    },
-    x: "center", // 图例在左（left）、右（right）、居中（center）、100px
-    y: "top", // 图例在上（top）、下（bottom）、居中（center、100px）、100px
-    padding: [15, 50, 0, 0] // 图例[距上右下左方距离
   },
   xAxis: {
+    show: true,
     axisLine: {
+      show: true,
       lineStyle: {
-        color: "#CBF2FA" // 文字颜色
+        color: '#CBF2FA',
+        width: 1
+      }
+    },
+    axisTick: {
+      show: true,
+      lineStyle: {
+        color: '#CBF2FA'
       }
     },
     axisLabel: {
-      fontSize: 22, // 设置 x 轴文字大小
+      fontSize: 14,
-      color: "#CBF2FA", // 可以同时设置文字颜色
+      color: '#CBF2FA',
-      rotate: 20, // 文字倾斜45度
+      rotate: 0,
-      margin: 20 // 增加文字与轴线的距离
+      margin: 15
     },
     type: "category",
-    data: ["微型企业", "小型企业", "中型企业", "大型企业"]
+    data: ["第一产业", "第二产业", "第三产业"]
   },
   yAxis: {
-    //网格线
+    //确保所有网格线都显示
     splitLine: {
       show: true,
       lineStyle: {
-        color: ["#A1C7CD"], // 线颜色
+        color: '#A1C7CD',
-        opacity: 0.2 // 透明度
+        opacity: 0.3,
+        type: 'solid',
+        width: 1
       }
     },
+    //设置y轴范围和间隔以显示更多网格线
+    min: 0,
+    max: 600, //根据数据最大值设置合适的范围
+    interval: 100, //设置固定间隔以确保显示足够的网格线
     axisLine: {
-      lineStyle: {
+      show: false
-        color: "#CBF2FA" // 文字颜色
+    },
-      }
+    axisTick: {
+      show: false
     },
     axisLabel: {
-      fontSize: 20, // 设置 x 轴文字大小
+      show: false
-      color: "#CBF2FA" // 可以同时设置文字颜色
     },
     type: "value"
   },
   series: [
     {
-      name: "岗位种类数",
+      name: "企业数",
       type: "bar",
-      showBackground: true,
+      showBackground: false,
-      barWidth: 8,
+      barWidth: 25,
-      data: [93, 231, 413, 451],
+      data: [6, 581, 41],
       // 设置柱状图的数值
       label: {
         show: true,
         position: "top",
-        color: "#30DCFF",
+        color: '#30DCFF',
-        fontSize: 22
+        fontSize: 14,
+        formatter: function(params) {
+          return params.value + '家';
+        }
       },
       itemStyle: {
-        //渐变色
+        //纯色
-        color: {
+        color: '#30DCFF'
-          type: "linear",
-          x: 1,
-          y: 0,
-          x2: 0,
-          y2: 1,
-          colorStops: [
-            { offset: 0, color: "rgba(48, 220, 255, 1)" },
-            { offset: 1, color: "rgba(48, 220, 255, 0.06)" }
-          ]
-        }
-      }
-    },
-    {
-      name: "岗位人员数",
-      type: "bar",
-      showBackground: true,
-      barWidth: 8,
-      data: [451, 2110, 19356, 57083],
-      // 设置柱状图的数值
-      label: {
-        show: true,
-        position: "top",
-        color: "#CBF2FA",
-        fontSize: 22
-      },
-      itemStyle: {
-        //渐变色
-        color: {
-          type: "linear",
-          x: 1,
-          y: 0,
-          x2: 0,
-          y2: 1,
-          colorStops: [
-            { offset: 0, color: "rgba(203, 242, 250, 1)" },
-            { offset: 1, color: "rgba(203, 242, 250, 0.08)" }
-          ]
-        }
       }
     }
   ]

src/views/recruitment/card/LaborSystemTwo.vue

@@ -37,8 +37,80 @@ const initialPoints = [
     name: "成华",
     value: [104.108719, 30.665854, 0],
     count: 0
+  },
+  {
+    name: "攀枝花",
+    value: [101.716007,26.580446, 0],
+    count: 0
+  },
+  {
+    name: "雅安",
+    value: [103.001033,29.987722, 0],
+    count: 0
+  },
+  {
+    name: "眉山",
+    value: [103.831788,30.048318, 0],
+    count: 0
+  },
+  {
+    name: "自贡",
+    value: [104.773447,29.352765, 0],
+    count: 0
+  },
+  {
+    name: "资阳",
+    value: [104.641917,30.122211, 0],
+    count: 0
+  },
+  {
+    name: "泸州",
+    value: [105.443348,28.889138, 0],
+    count: 0
+  },
+  {
+    name: "遂宁",
+    value: [105.571331,30.513311, 0],
+    count: 0
+  },
+  {
+    name: "广安",
+    value: [106.633369,30.456398, 0],
+    count: 0
+  },
+  {
+    name: "德阳",
+    value: [104.398651,31.127991, 0],
+    count: 0
+  },
+  {
+    name: "绵阳",
+    value: [104.741722,31.46402, 0],
+    count: 0
+  },
+  {
+    name: "广元",
+    value: [105.829757,32.433668, 0],
+    count: 0
+  },
+  {
+    name: "达州",
+    value: [107.502262,31.209484, 0],
+    count: 0
+  },
+  {
+    name: "南充",
+    value: [106.082974,30.795281, 0],
+    count: 0
+  },
+  {
+    name: "巴中",
+    value: [106.753669,31.858809, 0],
+    count: 0
   }
 ];
+
+
 // 地图参数设置
 let option = {
   tooltip: {

src/views/recruitment/index.vue

@@ -20,9 +20,9 @@
           indicator-position="none"
           :autoplay="true"
         >
-          <el-carousel-item><EnterpriseEmploymentOne /></el-carousel-item>
+            <el-carousel-item><EnterpriseEmploymentOne /></el-carousel-item>
           <el-carousel-item><EnterpriseEmploymentTwo /></el-carousel-item>
-          <el-carousel-item><EnterpriseEmploymentThree /></el-carousel-item>
+          <!-- <el-carousel-item><EnterpriseEmploymentThree /></el-carousel-item> -->
         </el-carousel>
       </enterprise-employment-card>
       <!-- 左2 -->
@@ -135,8 +135,8 @@ const asideMeun = reactive({
   ]
 });
 const cardOneInfo = {
-  title: "企业用工结构分布",
+  title: "服务企业用工机构分布",
-  description: "7万家企业(含个体工商户)",
+  description: "",
   type1: {
     title: "岗位种类数",
     count: "765个",