浏览代码

修改社会保障和文化旅游

zt 1 年之前
父节点
当前提交
aa1b170351

+ 2 - 2
nngkxxdp/src/main/resources/static/natj/dataCenter/css/index.css

@@ -3,7 +3,7 @@
     width: 1400px;
     margin: 10px auto;
     display: flex;
-    height: 900px;
+    /* height: 900px; */
 }
 
 .arrow {
@@ -41,7 +41,7 @@
 }
 /* 公共样式 */
 .content {
-    height: 729px;
+    /* height: 729px; */
     width: -moz-calc(100% - 150px);
     width: -webkit-calc(100% - 150px);
     width: calc(100% - 150px);

二进制
nngkxxdp/src/main/resources/static/natj/dataCenter/images/skill-title.png


二进制
nngkxxdp/src/main/resources/static/natj/dataCenter/images/title-bg.png


+ 142 - 9
nngkxxdp/src/main/resources/static/natj/dataCenter/index.html

@@ -10,10 +10,25 @@
     <link rel="stylesheet" href="css/index.css">
     <style>
         #whlyEchar {
-            width: 1005px;
+            width: 1400px;
+            height: 710px;
+        }
+
+        #gyykEchart {
+            width: 1400px;
             height: 710px;
         }
 
+        #zsrEchart {
+            width: 800px;
+            height: 510px;
+        }
+
+        #cyrsEchart{
+            width: 720px;
+            height: 510px;
+        }
+
         #shjzEchar {
             width: 1400px;
             height: 710px;
@@ -49,6 +64,46 @@
             height: 710px;
             margin: auto;
         }
+
+        .chart-box {}
+
+        .chart-item>.title {
+            width: 683px;
+            height: 63px;
+            background-image: url('./images/title-bg.png');
+            background-size: 100% 100%;
+            text-align: center;
+            margin: 40px auto;
+        }
+
+        .chart-item>.title span {
+            line-height: 63px;
+            font-size: 26px;
+            font-family: DOUYU;
+            font-weight: normal;
+            color: #FFFFFF;
+            text-shadow: 0px 4px 0px rgba(24, 63, 108, 0.14);
+            background: linear-gradient(0deg, #F8FCFF 0%, #CFE1FF 100%);
+            -webkit-background-clip: text;
+        }
+
+        .skills-box {
+            display: flex;
+            justify-content: space-between;
+        }
+
+        .skills-item .title {
+            background-image: url('./images/skill-title.png');
+            background-size: 100% 100%;
+            width: 252px;
+            line-height: 50px;
+            font-size: 20px;
+            font-family: Microsoft YaHei;
+            font-weight: 600;
+            color: #0084FF;
+            margin: 55px auto;
+            margin-bottom: 0
+        }
     </style>
 </head>
 
@@ -82,7 +137,7 @@
         </div>
         <div class="content">
             <div class="items div-shbz" style="display: none;">
-                <div class="year" style="position: relative;">
+                <!-- <div class="year" style="position: relative;">
                     <span>年份:</span>
                     <select id="year">
                         <option value="2021">2021年</option>
@@ -90,8 +145,8 @@
                         <option value="2023年截至6月">2023年截至6月</option>
                     </select>
                     <img src="images/arrow.png" alt="" style="position: absolute;right: 10px;">
-                </div>
-                <ul class="itemData">
+                </div> -->
+                <!-- <ul class="itemData">
                     <li>
                         <img src="images/content_icon_one.png" alt="">
                         <div class="right">
@@ -172,10 +227,57 @@
                         <li>165</li>
                         <li>65</li>
                     </ul>
+                </div> -->
+                <div class="chart-box">
+                    <div class="chart-item">
+                        <div class="title"><span>就业失业</span></div>
+                        <div id="jysychart" style="width:1200px;height:300px;margin:auto"></div>
+                    </div>
+                    <div class="chart-item">
+                        <div class="title"><span>职业技能</span></div>
+                        <div class="skills-box">
+                            <div class="skills-item" style="text-align:center;margin-bottom:0">
+                                <div class="title">
+                                    创业贷款发放金额
+                                </div>
+                                <div id="skills1" style="width:457px;height:386px;margin:auto"></div>
+                            </div>
+                            <div class="skills-item" style="text-align:center;margin-bottom:0">
+                                <div class="title">
+                                    参加职业技能等级评价
+                                </div>
+                                <div id="skills2" style="width:457px;height:386px;margin:auto"></div>
+                            </div>
+                            <div class="skills-item" style="text-align:center;margin-bottom:0">
+                                <div class="title">
+                                    补贴性职业培训人数
+                                </div>
+                                <div id="skills3" style="width:457px;height:386px;margin:auto"></div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="chart-item">
+                        <div class="title"><span>案件结案</span></div>
+                        <div id="ajjachart" style="width:1200px;height:300px;margin:auto"></div>
+                        <div class="skills-box">
+                            <div class="skills-item">
+                                <div class="title" style="text-align:center;margin-bottom:0">
+                                    仲裁裁决数
+                                </div>
+                                <div id="arbitrate" style="width:668px;height:345px;margin:auto"></div>
+                            </div>
+                            <div class="skills-item">
+                                <div class="title" style="text-align:center;margin-bottom:0">
+                                    结案率
+                                </div>
+                                <div id="closingRate" style="width:668px;height:386px;margin:auto"></div>
+                            </div>
+                        </div>
+                    </div>
                 </div>
             </div>
             <div class="items div-whwl" style="display: none;">
-                <div style="display: flex;align-items: center;justify-content: space-between;width: 73%;">
+                <!-- <div style="display: flex;align-items: center;justify-content: space-between;width: 73%;">
                     <div class="wsylTable">
                         <ul class="title">
                             <li style="width: 110px;">范围</li>
@@ -191,10 +293,25 @@
                     <div class="range">
                         <button class="thisMonth click" style="border-radius: 4px 0px 0px 4px;border-right: none;"
                             onlick="thisMonth()">2023年8月</button>
-                        <button class="cumulat" style="border-radius: 0px 4px 4px 0px;border-left: none;">截至2023年8月累计</button>
+                        <button class="cumulat"
+                            style="border-radius: 0px 4px 4px 0px;border-left: none;">截至2023年8月累计</button>
+                    </div>
+                </div> -->
+                <div class="chart-item">
+                    <div class="title"><span>接待海内外游客数</span></div>
+                    <div id="whlyEchar"></div>
+                </div>
+                <div class="chart-item">
+                    <div class="title"><span>过夜游客数</span></div>
+                    <div id="gyykEchart"></div>
+                </div>
+                <div class="chart-item">
+                    <div class="title"><span>旅游总收入与从业人数</span></div>
+                    <div style="display:flex">
+                        <div id="zsrEchart"></div>
+                        <div id="cyrsEchart"></div>
                     </div>
                 </div>
-                <div id="whlyEchar"></div>
             </div>
             <div class="items div-wsyl" style="display: none;">
                 <ul class="title">
@@ -279,7 +396,7 @@
                         <option value="2021">2021年</option>
                         <option value="2022">2022年</option>
                     </select>
-                    <img src="images/arrow.png" alt="" style="position: absolute;right: 10px;">
+                    <img src="images/arrow.png" alt="" style="position: absolute;right: 20px;">
                 </div>
                 <div style="display: flex;">
                     <div class="perAndSchool">
@@ -308,6 +425,12 @@
 </body>
 <script src="js/jquery-3.5.1.min.js"></script>
 <script src="js/echarts.min.js"></script>
+<!-- 就业失业数据js-->
+<script src="js/employment.js"></script>
+<!-- 职业技能数据js-->
+<script src="js/skills.js"></script>
+<!-- 案件结案数据js-->
+<script src="js/closeCase.js"></script>
 <!-- 社会保障数据js -->
 <script src="js/socialSecurity.js"></script>
 <!-- 社会救助数据js -->
@@ -319,6 +442,11 @@
 <!-- 教育领域数据js -->
 <script src="js/education.js"></script>
 <script>
+    employment()
+    skills()
+    closeCase()
+</script>
+<script>
     // 判断进入的参数值
     function GetQueryString(name) {
         var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
@@ -330,7 +458,9 @@
     if (type == 1) {
         tapsIndex = 0;
         socialSecurity();
-
+        employment()
+        skills()
+        closeCase()
     } else if (type == 2) {
         tapsIndex = 1;
         culturalTourism();
@@ -398,6 +528,9 @@
                     tapsIndex = index;
                     if (index == 0) {
                         socialSecurity();
+                        employment()
+                        skills()
+                        closeCase()
                     } else if (index == 1) {
                         culturalTourism();
                     } else if (index == 2) {

+ 139 - 8
nngkxxdp/src/main/resources/static/natj/dataCenter/indexMobile.html

@@ -29,7 +29,7 @@
 
         #whlyEchar {
             width: 100vw;
-            height: 510px;
+            height: 410px;
         }
 
         #shjzEchar {
@@ -45,7 +45,22 @@
 
         #wsylchar {
             width: 100vw;
-            height: 710px;
+            height: 410px;
+        }
+
+        #gyykEchart {
+            width: 100vw;
+            height: 410px;
+        }
+
+        #zsrEchart {
+            width: 100vw;
+            height: 410px;
+        }
+
+        #cyrsEchart{
+            width: 100vw;
+            height: 410px;
         }
 
         #other1,
@@ -67,6 +82,43 @@
             height: 710px;
             margin: auto;
         }
+
+        .chart-item>.title {
+            height: 43px;
+            background-image: url('./images/title-bg.png');
+            background-size: 100% 100%;
+            text-align: center;
+            margin: 20px auto;
+        }
+
+        .chart-item>.title span {
+            line-height: 43px;
+            font-size: 15px;
+            font-family: DOUYU;
+            font-weight: normal;
+            color: #FFFFFF;
+            text-shadow: 0px 4px 0px rgba(24, 63, 108, 0.14);
+            background: linear-gradient(0deg, #F8FCFF 0%, #CFE1FF 100%);
+            -webkit-background-clip: text;
+        }
+
+        .skills-box {
+            /* display: flex;
+            justify-content: space-between; */
+        }
+
+        .skills-item .title {
+            background-image: url('./images/skill-title.png');
+            background-size: 100% 100%;
+            width: 252px;
+            line-height: 40px;
+            font-size: 18px;
+            font-family: Microsoft YaHei;
+            font-weight: 600;
+            color: #0084FF;
+            margin: 35px auto;
+            margin-bottom: 0
+        }
     </style>
 </head>
 
@@ -105,7 +157,7 @@
         </div>
         <div class="content">
             <div class="items div-shbz" style="display: none;">
-                <div class="year" style="position: relative;">
+                <!-- <div class="year" style="position: relative;">
                     <span>年份:</span>
                     <select id="year">
                         <option value="2021">2021年</option>
@@ -113,8 +165,8 @@
                         <option value="2023年截至6月">2023年截至6月</option>
                     </select>
                     <img src="images/arrow.png" alt="" style="position: absolute;right: 10px;">
-                </div>
-                <ul class="itemData">
+                </div> -->
+                <!--  <ul class="itemData">
                     <li>
                         <img src="images/content_icon_one.png" alt="">
                         <div class="right">
@@ -199,13 +251,61 @@
                         <li>165</li>
                         <li>65</li>
                     </div>
+                </div> -->
+                <div class="chart-box">
+                    <div class="chart-item">
+                        <div class="title"><span>就业失业</span></div>
+                        <div id="jysychart" style="width:300px;height:250px;margin:auto"></div>
+                    </div>
+                    <div class="chart-item">
+                        <div class="title"><span>职业技能</span></div>
+                        <div class="skills-box">
+                            <div class="skills-item" style="text-align:center;margin-bottom:0">
+                                <div class="title">
+                                    创业贷款发放金额
+                                </div>
+                                <div id="skills1" style="width:300px;height:250px;margin:auto"></div>
+                            </div>
+                            <div class="skills-item" style="text-align:center;margin-bottom:0">
+                                <div class="title">
+                                    参加职业技能等级评价
+                                </div>
+                                <div id="skills2" style="width:300px;height:250px;margin:auto"></div>
+                            </div>
+                            <div class="skills-item" style="text-align:center;margin-bottom:0">
+                                <div class="title">
+                                    补贴性职业培训人数
+                                </div>
+                                <div id="skills3" style="width:300px;height:250px;margin:auto"></div>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="chart-item">
+                        <div class="title"><span>案件结案</span></div>
+                        <div id="ajjachart" style="width:300px;height:250px;margin:auto"></div>
+                        <div class="skills-box">
+                            <div class="skills-item">
+                                <div class="title" style="text-align:center;margin-bottom:0">
+                                    仲裁裁决数
+                                </div>
+                                <div id="arbitrate" style="width:300px;height:250px;margin:auto"></div>
+                            </div>
+                            <div class="skills-item">
+                                <div class="title" style="text-align:center;margin-bottom:0">
+                                    结案率
+                                </div>
+                                <div id="closingRate" style="width:300px;height:250px;margin:auto"></div>
+                            </div>
+                        </div>
+                    </div>
                 </div>
             </div>
             <div class="items div-whwl" style="display: none;">
-                <div class="range">
+                <!-- <div class="range">
                     <button class="thisMonth click" style="border-radius: 4px 0px 0px 4px;border-right: none;"
                         onlick="thisMonth()">2023年8月</button>
-                    <button class="cumulat" style="border-radius: 0px 4px 4px 0px;border-left: none;">截至2023年8月累计</button>
+                    <button class="cumulat"
+                        style="border-radius: 0px 4px 4px 0px;border-left: none;">截至2023年8月累计</button>
                 </div>
                 <div class="wsylTable">
                     <ul class="title">
@@ -221,6 +321,21 @@
                 </div>
                 <div style="overflow-x: scroll;">
                     <div id="whlyEchar"></div>
+                </div> -->
+                <div class="chart-item">
+                    <div class="title"><span>接待海内外游客数</span></div>
+                    <div id="whlyEchar"></div>
+                </div>
+                <div class="chart-item">
+                    <div class="title"><span>过夜游客数</span></div>
+                    <div id="gyykEchart"></div>
+                </div>
+                <div class="chart-item">
+                    <div class="title"><span>旅游总收入与从业人数</span></div>
+                    <div>
+                        <div id="zsrEchart"></div>
+                        <div id="cyrsEchart"></div>
+                    </div>
                 </div>
             </div>
             <div class="items div-wsyl" style="display: none;">
@@ -326,6 +441,12 @@
 </body>
 <script src="js/jquery-3.5.1.min.js"></script>
 <script src="js/echarts.min.js"></script>
+<!-- 就业失业数据js-->
+<script src="js/employment.js"></script>
+<!-- 职业技能数据js-->
+<script src="js/skills.js"></script>
+<!-- 案件结案数据js-->
+<script src="js/closeCase.js"></script>
 <!-- 社会保障数据js -->
 <script src="js/socialSecurity.js"></script>
 <!-- 社会救助数据js -->
@@ -337,6 +458,11 @@
 <!-- 教育领域数据js -->
 <script src="js/education.js"></script>
 <script>
+    employment()
+    skills()
+    closeCase()
+</script>
+<script>
     // 判断进入的参数值
     function GetQueryString(name) {
         var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
@@ -348,7 +474,9 @@
     if (type == 1) {
         tapsIndex = 0;
         socialSecurity();
-
+        employment()
+        skills()
+        closeCase()
     } else if (type == 2) {
         tapsIndex = 1;
         culturalTourism();
@@ -417,6 +545,9 @@
                     tapsIndex = index;
                     if (index == 0) {
                         socialSecurity();
+                        employment()
+                        skills()
+                        closeCase()
                     } else if (index == 1) {
                         culturalTourism();
                     } else if (index == 2) {

+ 111 - 0
nngkxxdp/src/main/resources/static/natj/dataCenter/js/closeCase.js

@@ -0,0 +1,111 @@
+function closeCase() {
+  var chartDom = document.getElementById("ajjachart");
+  var myChart = echarts.init(chartDom);
+  var option;
+  myChart.clear();
+  option = {
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "shadow",
+      },
+    },
+    legend: {},
+    grid: {
+      left: "3%",
+      right: "4%",
+      bottom: "3%",
+      containLabel: true,
+    },
+    xAxis: {
+      type: "category",
+      boundaryGap: [0, 0.01],
+      data: ["2022年全年", "2023年一季度", "2023年二季度", "2023年三季度"],
+    },
+    yAxis: {
+      type: "value",
+      data: ["Brazil", "Indonesia", "USA", "India", "China", "World"],
+    },
+    series: [
+      {
+        name: "纠纷总数",
+        type: "bar",
+        data: [18203, 23489, 29034, 104970, 131744, 630230],
+      },
+      {
+        name: "涉及人数",
+        type: "bar",
+        data: [19325, 23438, 31000, 121594, 134141, 681807],
+      },
+      {
+        name: "结案数量",
+        type: "bar",
+        data: [19325, 23438, 31000, 121594, 134141, 681807],
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+
+  var chartDom = document.getElementById("arbitrate");
+  var myChart = echarts.init(chartDom);
+  var option;
+  myChart.clear();
+  option = {
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "shadow",
+      },
+    },
+    legend: {
+      show: false,
+    },
+    grid: {
+      left: "3%",
+      right: "4%",
+      bottom: "3%",
+      containLabel: true,
+    },
+    xAxis: {
+      type: "category",
+      boundaryGap: [0, 0.01],
+      data: ["2022年全年", "2023年一季度", "2023年二季度", "2023年三季度"],
+    },
+    yAxis: {
+      type: "value",
+      data: ["Brazil", "Indonesia", "USA", "India", "China", "World"],
+    },
+    series: [
+      {
+        name: "纠纷总数",
+        type: "bar",
+        data: [18203, 23489, 29034, 104970, 131744, 630230],
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+
+  var chartDom = document.getElementById("closingRate");
+  var myChart = echarts.init(chartDom);
+  var option;
+
+  option = {
+    xAxis: {
+      type: "category",
+      data: ["2022年全年", "2023年一季度", "2023年二季度", "2023年三季度"],
+    },
+    yAxis: {
+      type: "value",
+    },
+    series: [
+      {
+        data: [150, 230, 224, 218, 135, 147, 260],
+        type: "line",
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+}

+ 440 - 370
nngkxxdp/src/main/resources/static/natj/dataCenter/js/culturalTourism.js

@@ -1,379 +1,449 @@
 function culturalTourism() {
-    // 文化旅游
-    $('.cumulat').removeClass('click');
-    $('.thisMonth').addClass('click');
-    var shbzTableHtml = `
-        <ul class="title">
-        <li style="width: 111px;">范围</li>
-        <li><span>旅游总收入</span><span>(万元)</span></li>
-        <li><span>旅游从业人数</span><span>(人)</span></li>
-        </ul>
-                    <ul class="number">
-                       <li style="width: 110px;">2023年8月</li>
-                       <li>286332</li>
-                       <li>6652</li>
-                    </ul>
-                `
-    $(".wsylTable").empty().html(shbzTableHtml)
-    var chartDom = document.getElementById('whlyEchar');
-    var myChart = echarts.init(chartDom);
-    var alldata = [[3418160, 352098], [33427158, 2604714]];
-    var option;
-    var data = alldata[0]
-    option = {
-        grid: {
-            // 网格线配置
-            show: true,
-            lineStyle: {
-                color: ["#e9e9e9"],
-                width: 1,
-                type: "solid",
-            },
-            left: 100
+  // 文化旅游
+  var chartDom = document.getElementById("whlyEchar");
+  var myChart = echarts.init(chartDom);
+  var alldata = [
+    [3418160, 352098],
+    [33427158, 2604714],
+  ];
+  var option;
+  var data = alldata[0];
+  option = {
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "cross",
+        crossStyle: {
+          color: "#999",
         },
+      },
+    },
+    legend: {
+      data: ["海外游客", "国内游客", "国内游客同比增减", "海外游客同比增减"],
+    },
+    xAxis: [
+      {
+        type: "category",
+        data: [
+          "2023年1月",
+          "2023年2月",
+          "2023年3月",
+          "2023年4月",
+          "2023年5月",
+          "2023年6月",
+          "2023年7月",
+          "2023年8月",
+          "2023年9月",
+          "2023年10月",
+        ],
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: "value",
+        name: "游客数",
+        axisLabel: {
+          formatter: "{value} 人次",
+        },
+      },
+      {
+        type: "value",
+        name: "同比增减",
+        interval: 5,
+        max: 50,
+        axisLabel: {
+          formatter: "{value} %",
+        },
+      },
+    ],
+    series: [
+      {
+        name: "海外游客",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [0, 788, 1026, 1740, 1967, 2200, 2720, 2748, 3231, 5539],
+      },
+      {
+        name: "国内游客",
+        type: "bar",
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [
+          4741245, 4821452, 4524574, 4054582, 4484144, 3325145, 4047415,
+          3415412, 4851414, 4914414,
+        ],
+        itemStyle: {
+          color: "red",
+        },
+      },
+      {
+        name: "国内同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [
+          33.46, 20.45, 26.2, 28.72, 18.09, 16.04, 10.66, 17.96, 13.98, 6.38,
+        ],
+      },
+      {
+        name: "海外同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+
+  var chartDom = document.getElementById("gyykEchart");
+  var myChart = echarts.init(chartDom);
+  var alldata = [
+    [3418160, 352098],
+    [33427158, 2604714],
+  ];
+  var option;
+  var data = alldata[0];
+  option = {
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "cross",
+        crossStyle: {
+          color: "#999",
+        },
+      },
+    },
+    legend: {
+      data: [
+        "过夜游客",
+        "入境过夜住宿游客",
+        "过夜游客同比增减",
+        "入境过夜住宿游客同比增减",
+      ],
+    },
+    xAxis: [
+      {
+        type: "category",
+        data: [
+          "2023年1月",
+          "2023年2月",
+          "2023年3月",
+          "2023年4月",
+          "2023年5月",
+          "2023年6月",
+          "2023年7月",
+          "2023年8月",
+          "2023年9月",
+          "2023年10月",
+        ],
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: "value",
+        name: "游客数",
+        axisLabel: {
+          formatter: "{value} 人次",
+        },
+      },
+      {
+        type: "value",
+        name: "同比增减",
+        interval: 20,
+        max: 200,
+        axisLabel: {
+          formatter: "{value} %",
+        },
+      },
+    ],
+    series: [
+      {
+        name: "过夜游客",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [
+          254124, 303870, 300848, 355720, 326500, 310942, 389612, 352098,
+          284177, 344331,
+        ],
+      },
+      {
+        name: "入境过夜住宿游客",
+        type: "bar",
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [0, 788, 1026, 1740, 1967, 2200, 2720, 2748, 3231, 5539],
+        itemStyle: {
+          color: "red",
+        },
+      },
+      {
+        name: "过夜游客同比增减",
+        type: "line",
+        yAxisIndex: 1,
         tooltip: {
-            trigger: 'axis',
-            axisPointer: {
-                type: 'shadow'
-            },
-            backgroundColor: "rgb(0 0 0 / 40%)",
-            borderColor: 'none',
-            formatter: function (params) {
-                let total = params[0].value + params[1].value;
-                var html = "";
-                html = `<div
-                    style="font-size: 14px;font-family: Microsoft YaHei;color: #FFFFFF;width: 206px;border-radius: 10px;box-sizing: border-box;position: relative;">
-                    <div>`+ params[0].axisValue + `:</div>
-                    <div>`+ total.toLocaleString() + `人次<span style="margin-left:20px;"></span></div>
-                    <div style="width: 272px;height: 1px;background:rgb(255 255 255 / 32%);margin: 10px 0;"></div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[0].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[0].seriesName + `:
-                        `+ params[0].value.toLocaleString() + `人次</span>
-                    </div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[1].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[1].seriesName + `:
-                        `+ params[1].value.toLocaleString() + `人次</span><span style="margin-left:20px;"></span>
-                    </div>
-                </div>`
-                return html;
-            },
-            confine: true
-        },
-        xAxis: {
-            type: 'category',
-            data: ['接待海内外游客', '过夜游客'],
-            axisLabel: {
-                show: true,
-                textStyle: {
-                    color: '#333',  //更改坐标轴文字颜色
-                    fontSize: 14      //更改坐标轴文字大小
-                }
-            },
-            isTick: {
-                show: true  //坐标轴刻度线
-            },
-            axisLine: { //轴线
-                show: true
-            },
-            splitLine: { //网格线
-                show: true
-            },
-        },
-        yAxis: {
-            type: 'value',
-            min: 0,
-            max: 5000000,
-            interval: 1000000,
-            axisLabel: {
-                formatter: '{value}人次'
-            },
-            axisTick: {
-                show: true  //坐标轴刻度线
-            },
-            axisLine: { //轴线
-                show: true
-            },
-            splitLine: { //网格线
-                show: true
-            }
-        },
-        series: [
-            {
-                name: '海外游客',
-                barWidth: 100,
-                data: [0, 0],
-                type: 'bar',
-                itemStyle: {
-                    color: '#A7D0FD'
-                },
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [
+          22.09, 95.24, 132.26, 181.72, 116.83, 32.77, 106.47, 17.96, 26.06,
+          18.81,
+        ],
+      },
+      {
+        name: "入境过夜住宿游客同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+      },
+    ],
+  };
 
-            },
-            //4256415 225424 322450 31012
-            //31762696 1724264 2370899 286838
-            {
-                name: '海内游客',
-                barWidth: 100,
-                data: data,
-                type: 'bar',
-                barGap: '-100%',//移动第二个柱子的位置实现重叠
-                z: '-1',//改变这根柱子的层级使这根柱子在下面,
-                itemStyle: {
-                    color: '#509EF3'
-                }
+  option && myChart.setOption(option);
 
-            }
-        ]
-    };
-    option && myChart.setOption(option);
-    // 文化旅游
-    $('.thisMonth').click(function () {
-        $('.cumulat').removeClass('click');
-        $('.thisMonth').addClass('click');
-        var shbzTableHtml = `
-        <ul class="title">
-        <li style="width: 111px;">范围</li>
-        <li><span>旅游总收入</span><span>(万元)</span></li>
-        <li><span>旅游从业人数</span><span>(人)</span></li>
-        </ul>
-                    <ul class="number">
-                        <li style="width: 110px;">2023年8月</li>
-                        <li>286332</li>
-                        <li>6652</li>
-                    </ul>
-                `
-        $(".wsylTable").empty().html(shbzTableHtml)
-        var option;
-        var data = alldata[0]
-        option = {
-            grid: {
-                // 网格线配置
-                show: true,
-                lineStyle: {
-                    color: ["#e9e9e9"],
-                    width: 1,
-                    type: "solid",
-                },
-                left: 100
-            },
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                    type: 'shadow'
-                },
-                backgroundColor: "rgb(0 0 0 / 40%)",
-                borderColor: 'none',
-                formatter: function (params) {
-                    let total = params[0].value + params[1].value;
-                    var html = "";
-                    html = `<div
-                    style="font-size: 14px;font-family: Microsoft YaHei;color: #FFFFFF;width: 206px;border-radius: 10px;box-sizing: border-box;position: relative;">
-                    <div>`+ params[0].axisValue + `:</div>
-                    <div>`+ total.toLocaleString() + `人次<span style="margin-left:20px;"></span></div>
-                    <div style="width: 272px;height: 1px;background:rgb(255 255 255 / 32%);margin: 10px 0;"></div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[0].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[0].seriesName + `:
-                        `+ params[0].value.toLocaleString() + `人次</span>
-                    </div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[1].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[1].seriesName + `:
-                        `+ params[1].value.toLocaleString() + `人次</span><span style="margin-left:20px;"></span>
-                    </div>
-                </div>`
-                    return html;
-                },
-                confine: true
-            },
-            xAxis: {
-                type: 'category',
-                data: ['接待海内外游客', '过夜游客'],
-                axisLabel: {
-                    show: true,
-                    textStyle: {
-                        color: '#333',  //更改坐标轴文字颜色
-                        fontSize: 14      //更改坐标轴文字大小
-                    }
-                },
-                isTick: {
-                    show: true  //坐标轴刻度线
-                },
-                axisLine: { //轴线
-                    show: true
-                },
-                splitLine: { //网格线
-                    show: true
-                },
-            },
-            yAxis: {
-                type: 'value',
-                min: 0,
-                max: 5000000,
-                interval: 1000000,
-                axisLabel: {
-                    formatter: '{value}(人次)'
-                },
-                axisTick: {
-                    show: true  //坐标轴刻度线
-                },
-                axisLine: { //轴线
-                    show: true
-                },
-                splitLine: { //网格线
-                    show: true
-                }
-            },
-            series: [
-                {
-                    name: '海外游客',
-                    barWidth: 100,
-                    data: [0, 0],
-                    type: 'bar',
-                    itemStyle: {
-                        color: '#A7D0FD'
-                    }
-                },
-                //4256415 225424 322450 31012
-                //31762696 1724264 2370899 286838
-                {
-                    name: '海内游客',
-                    barWidth: 100,
-                    data: data,
-                    type: 'bar',
-                    barGap: '-100%',//移动第二个柱子的位置实现重叠
-                    z: '-1',//改变这根柱子的层级使这根柱子在下面,
-                    itemStyle: {
-                        color: '#509EF3'
-                    }
+  var chartDom = document.getElementById("zsrEchart");
+  var myChart = echarts.init(chartDom);
+  var alldata = [
+    [3418160, 352098],
+    [33427158, 2604714],
+  ];
+  var option;
+  var data = alldata[0];
+  option = {
+    title:{
+        text:'旅游总收入'
+    },
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "cross",
+        crossStyle: {
+          color: "#999",
+        },
+      },
+    },
+    legend: {
+      data: ["旅游总收入"],
+    },
+    xAxis: [
+      {
+        type: "category",
+        data: [
+          "2023年1月",
+          "2023年2月",
+          "2023年3月",
+          "2023年4月",
+          "2023年5月",
+          "2023年6月",
+          "2023年7月",
+          "2023年8月",
+          "2023年9月",
+          "2023年10月",
+        ],
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: "value",
+        name: "总收入",
+        axisLabel: {
+          formatter: "{value} 万元",
+        },
+      },
+      {
+        type: "value",
+        name: "同比增减",
+        interval: 20,
+        max: 100,
+        axisLabel: {
+          formatter: "{value} %",
+        },
+      },
+    ],
+    series: [
+      {
+        name: "旅游总收入",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 万元";
+          },
+        },
+        data: [
+          251414, 304154, 322454, 308451, 424215, 298541, 353411, 296332,
+          384412, 311452,
+        ],
+      },
+      {
+        name: "旅游总收入同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [
+          38.55, 24.93, 34.84, 20.75, 26.53, 20.44, 15.02, 20.03, 19.22, 8.82,
+        ],
+      },
+    ],
+  };
 
-                }
-            ]
-        };
-        myChart.clear();
-        option && myChart.setOption(option);
-    })
-    $('.cumulat').click(function () {
-        $('.cumulat').addClass('click');
-        $('.thisMonth').removeClass('click');
-        var shbzTableHtml = `
-        <ul class="title">
-        <li style="width: 111px;">范围</li>
-        <li><span>旅游总收入</span><span>(万元)</span></li>
-        <li><span>旅游从业人数</span><span>(人)</span></li>
-        </ul>
-                    <ul class="number">
-                         <li style="width: 110px;">截至2023年8月累计</li>
-                       <li>2548972</li>
-                       <li>535711</li>
-                    </ul>
-                `
-        $(".wsylTable").empty().html(shbzTableHtml)
-        var option;
-        var data = alldata[1]
-        option = {
-            grid: {
-                // 网格线配置
-                show: true,
-                lineStyle: {
-                    color: ["#e9e9e9"],
-                    width: 1,
-                    type: "solid",
-                },
-                left: 110
-            },
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                    type: 'shadow'
-                },
-                backgroundColor: "rgb(0 0 0 / 40%)",
-                borderColor: 'none',
-                formatter: function (params) {
-                    let total = params[0].value + params[1].value;
-                    
-                    var html = "";
-                    html = `<div
-                    style="font-size: 14px;font-family: Microsoft YaHei;color: #FFFFFF;width: 206px;border-radius: 10px;box-sizing: border-box;position: relative;">
-                    <div>`+ params[0].axisValue + `:</div>
-                    <div>`+ total.toLocaleString() + `人次<span style="margin-left:20px;"></span></div>
-                    <div style="width: 272px;height: 1px;background:rgb(255 255 255 / 32%);margin: 10px 0;"></div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[0].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[0].seriesName + `:
-                        `+ params[0].value.toLocaleString() + `人次</span>
-                    </div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[1].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[1].seriesName + `:
-                        `+ params[1].value.toLocaleString() + `人次</span><span style="margin-left:20px;"></span>
-                    </div>
-                </div>`
-                    return html;
-                },
-                confine: true
-            },
-            xAxis: {
-                type: 'category',
-                data: ['接待海内外游客', '过夜游客'],
-                axisLabel: {
-                    show: true,
-                    textStyle: {
-                        color: '#333',  //更改坐标轴文字颜色
-                        fontSize: 14      //更改坐标轴文字大小
-                    }
-                },
-                isTick: {
-                    show: true  //坐标轴刻度线
-                },
-                axisLine: { //轴线
-                    show: true
-                },
-                splitLine: { //网格线
-                    show: true
-                },
-            },
-            yAxis: {
-                type: 'value',
-                min: 0,
-                max: 35000000,
-                interval: 10000000,
-                axisLabel: {
-                    formatter: '{value}(人次)'
-                },
-                axisTick: {
-                    show: true  //坐标轴刻度线
-                },
-                axisLine: { //轴线
-                    show: true
-                },
-                splitLine: { //网格线
-                    show: true
-                }
-            },
-            series: [
-                {
-                    name: '海外游客',
-                    barWidth: 100,
-                    data: [0, 0],
-                    type: 'bar',
-                    itemStyle: {
-                        color: '#A7D0FD'
-                    }
-                },
-                //4256415 225424 322450 31012
-                //31762696 1724264 2370899 286838
-                {
-                    name: '海内游客',
-                    barWidth: 100,
-                    data: data,
-                    type: 'bar',
-                    barGap: '-100%',//移动第二个柱子的位置实现重叠
-                    z: '-1',//改变这根柱子的层级使这根柱子在下面,
-                    itemStyle: {
-                        color: '#509EF3'
-                    }
+  option && myChart.setOption(option);
 
-                }
-            ]
-        };
-        myChart.clear();
-        option && myChart.setOption(option);
-    })
+  var chartDom = document.getElementById("cyrsEchart");
+  var myChart = echarts.init(chartDom);
+  var alldata = [
+    [3418160, 352098],
+    [33427158, 2604714],
+  ];
+  var option;
+  var data = alldata[0];
+  option = {
+    title:{
+        text:'旅游从业人数'
+    },
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "cross",
+        crossStyle: {
+          color: "#999",
+        },
+      },
+    },
+    legend: {
+      data: ["旅游从业人数"],
+    },
+    xAxis: [
+      {
+        type: "category",
+        data: [
+          "2023年1月",
+          "2023年2月",
+          "2023年3月",
+          "2023年4月",
+          "2023年5月",
+          "2023年6月",
+          "2023年7月",
+          "2023年8月",
+          "2023年9月",
+          "2023年10月",
+        ],
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: "value",
+        name: "旅游从业人数",
+        axisLabel: {
+          formatter: "{value} 人次",
+        },
+      },
+      {
+        type: "value",
+        name: "同比增减",
+        interval: 5,
+        max: 30,
+        axisLabel: {
+          formatter: "{value} %",
+        },
+      },
+    ],
+    series: [
+      {
+        name: "旅游从业人数",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [
+          33102, 33104, 33245, 33447, 33541, 33654, 33145, 33210, 32010, 32511,
+        ],
+      },
+      {
+        name: "旅游直接从业人数",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 万元";
+          },
+        },
+        data: [6642, 6647, 6721, 6842, 6847, 6719, 6641, 6652, 6622, 6421],
+      },
+      {
+        name: "旅游从业人数同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [3.12, 3.05, 3.54, 4.2, 4.86, 5.23, 3.67, 5.57, 3.22, 4.07],
+      },
+      {
+        name: "旅游直接从业人数同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [3.46, 3.46, 4.69, 6.66, 6.98, 5.15, 4.03, 4.76, 4.88, 2.88],
+      },
+    ],
+  };
 
+  option && myChart.setOption(option);
 }

+ 464 - 373
nngkxxdp/src/main/resources/static/natj/dataCenter/js/culturalTourismMobile.js

@@ -1,382 +1,473 @@
 function culturalTourism() {
-    // 文化旅游
-    $('.cumulat').removeClass('click');
-    $('.thisMonth').addClass('click');
-    var shbzTableHtml = `
-        <ul class="title">
-        <li style="width: 111px;">范围</li>
-        <li><span>旅游总收入</span><span>(万元)</span></li>
-        <li><span>旅游从业人数</span><span>(人)</span></li>
-        </ul>
-                    <ul class="number">
-                       <li style="width: 110px;">2023年8月</li>
-                       <li>286332</li>
-                       <li>6652</li>
-                    </ul>
-                `
-    $(".wsylTable").empty().html(shbzTableHtml)
-    var chartDom = document.getElementById('whlyEchar');
-    var myChart = echarts.init(chartDom);
-    var alldata = [[3418160, 352098], [33427158, 2604714]];
-    var option;
-    var data = alldata[0]
-    option = {
-        grid: {
-            // 网格线配置
-            show: true,
-            lineStyle: {
-                color: ["#e9e9e9"],
-                width: 1,
-                type: "solid",
-            },
-            left: 100
+  // 文化旅游
+  var chartDom = document.getElementById("whlyEchar");
+  var myChart = echarts.init(chartDom);
+  var alldata = [
+    [3418160, 352098],
+    [33427158, 2604714],
+  ];
+  var option;
+  var data = alldata[0];
+  option = {
+    tooltip: {
+      trigger: "axis",
+      confine: true,
+      axisPointer: {
+        type: "cross",
+        crossStyle: {
+          color: "#999",
         },
+      },
+    },
+    grid: {
+      containLabel: true,
+    },
+    legend: {
+      data: ["海外游客", "国内游客", "国内游客同比增减", "海外游客同比增减"],
+    },
+    xAxis: [
+      {
+        type: "category",
+        data: [
+          "2023年1月",
+          "2023年2月",
+          "2023年3月",
+          "2023年4月",
+          "2023年5月",
+          "2023年6月",
+          "2023年7月",
+          "2023年8月",
+          "2023年9月",
+          "2023年10月",
+        ],
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: "value",
+        name: "游客数",
+        axisLabel: {
+          formatter: "{value} 人次",
+        },
+      },
+      {
+        type: "value",
+        name: "同比增减",
+        interval: 5,
+        max: 50,
+        axisLabel: {
+          formatter: "{value} %",
+        },
+      },
+    ],
+    series: [
+      {
+        name: "海外游客",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [0, 788, 1026, 1740, 1967, 2200, 2720, 2748, 3231, 5539],
+      },
+      {
+        name: "国内游客",
+        type: "bar",
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [
+          4741245, 4821452, 4524574, 4054582, 4484144, 3325145, 4047415,
+          3415412, 4851414, 4914414,
+        ],
+        itemStyle: {
+          color: "red",
+        },
+      },
+      {
+        name: "国内同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [
+          33.46, 20.45, 26.2, 28.72, 18.09, 16.04, 10.66, 17.96, 13.98, 6.38,
+        ],
+      },
+      {
+        name: "海外同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+
+  var chartDom = document.getElementById("gyykEchart");
+  var myChart = echarts.init(chartDom);
+  var alldata = [
+    [3418160, 352098],
+    [33427158, 2604714],
+  ];
+  var option;
+  var data = alldata[0];
+  option = {
+    tooltip: {
+      trigger: "axis",
+      confine: true,
+      axisPointer: {
+        type: "cross",
+        crossStyle: {
+          color: "#999",
+        },
+      },
+    },
+    grid: {
+      top: 80,
+      containLabel: true,
+    },
+    legend: {
+      top: 0,
+      data: [
+        "过夜游客",
+        "入境过夜住宿游客",
+        "过夜游客同比增减",
+        "入境过夜住宿游客同比增减",
+      ],
+    },
+    xAxis: [
+      {
+        type: "category",
+        data: [
+          "2023年1月",
+          "2023年2月",
+          "2023年3月",
+          "2023年4月",
+          "2023年5月",
+          "2023年6月",
+          "2023年7月",
+          "2023年8月",
+          "2023年9月",
+          "2023年10月",
+        ],
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: "value",
+        name: "游客数",
+        axisLabel: {
+          formatter: "{value} 人次",
+        },
+      },
+      {
+        type: "value",
+        name: "同比增减",
+        interval: 20,
+        max: 200,
+        axisLabel: {
+          formatter: "{value} %",
+        },
+      },
+    ],
+    series: [
+      {
+        name: "过夜游客",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [
+          254124, 303870, 300848, 355720, 326500, 310942, 389612, 352098,
+          284177, 344331,
+        ],
+      },
+      {
+        name: "入境过夜住宿游客",
+        type: "bar",
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [0, 788, 1026, 1740, 1967, 2200, 2720, 2748, 3231, 5539],
+        itemStyle: {
+          color: "red",
+        },
+      },
+      {
+        name: "过夜游客同比增减",
+        type: "line",
+        yAxisIndex: 1,
         tooltip: {
-            trigger: 'axis',
-            axisPointer: {
-                type: 'shadow'
-            },
-            backgroundColor: "rgb(0 0 0 / 40%)",
-            borderColor: 'none',
-            formatter: function (params) {
-                let total = params[0].value + params[1].value;
-                var html = "";
-                html = `<div
-                    style="font-size: 14px;font-family: Microsoft YaHei;color: #FFFFFF;width: 206px;border-radius: 10px;box-sizing: border-box;position: relative;">
-                    <div>`+ params[0].axisValue + `:</div>
-                    <div>`+ total.toLocaleString() + `人次<span style="margin-left:20px;"></span></div>
-                    <div style="width: 272px;height: 1px;background:rgb(255 255 255 / 32%);margin: 10px 0;"></div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[0].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[0].seriesName + `:
-                        `+ params[0].value.toLocaleString() + `人次</span>
-                    </div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[1].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[1].seriesName + `:
-                        `+ params[1].value.toLocaleString() + `人次</span><span style="margin-left:20px;"></span>
-                    </div>
-                </div>`
-                return html;
-            },
-            confine: true
-        },
-        xAxis: {
-            type: 'category',
-            data: ['接待海内外游客', '过夜游客'],
-            axisLabel: {
-                show: true,
-				rotate: -30,
-                textStyle: {
-                    color: '#333',  //更改坐标轴文字颜色
-                    fontSize: 14      //更改坐标轴文字大小
-                }
-            },
-            isTick: {
-                show: true  //坐标轴刻度线
-            },
-            axisLine: { //轴线
-                show: true
-            },
-            splitLine: { //网格线
-                show: true
-            },
-        },
-        yAxis: {
-            type: 'value',
-            min: 0,
-            max: 5000000,
-            interval: 1000000,
-            axisLabel: {
-                formatter: '{value}人次'
-            },
-            axisTick: {
-                show: true  //坐标轴刻度线
-            },
-            axisLine: { //轴线
-                show: true
-            },
-            splitLine: { //网格线
-                show: true
-            }
-        },
-        series: [
-            {
-                name: '海外游客',
-                barWidth: 60,
-                data: [0, 0],
-                type: 'bar',
-                itemStyle: {
-                    color: '#A7D0FD'
-                },
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [
+          22.09, 95.24, 132.26, 181.72, 116.83, 32.77, 106.47, 17.96, 26.06,
+          18.81,
+        ],
+      },
+      {
+        name: "入境过夜住宿游客同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
+      },
+    ],
+  };
 
-            },
-            //4256415 225424 322450 31012
-            //31762696 1724264 2370899 286838
-            {
-                name: '海内游客',
-                barWidth: 60,
-                data: data,
-                type: 'bar',
-                barGap: '-100%',//移动第二个柱子的位置实现重叠
-                z: '-1',//改变这根柱子的层级使这根柱子在下面,
-                itemStyle: {
-                    color: '#509EF3'
-                }
+  option && myChart.setOption(option);
 
-            }
-        ]
-    };
-    option && myChart.setOption(option);
-    // 文化旅游
-    $('.thisMonth').click(function () {
-        $('.cumulat').removeClass('click');
-        $('.thisMonth').addClass('click');
-        var shbzTableHtml = `
-        <ul class="title">
-        <li style="width: 111px;">范围</li>
-        <li><span>旅游总收入</span><span>(万元)</span></li>
-        <li><span>旅游从业人数</span><span>(人)</span></li>
-        </ul>
-                    <ul class="number">
-                        <li style="width: 110px;">2023年8月</li>
-                       <li>286332</li>
-                       <li>6652</li>
-                    </ul>
-                `
-        $(".wsylTable").empty().html(shbzTableHtml)
-        var option;
-        var data = alldata[0]
-        option = {
-            grid: {
-                // 网格线配置
-                show: true,
-                lineStyle: {
-                    color: ["#e9e9e9"],
-                    width: 1,
-                    type: "solid",
-                },
-                left: 100
-            },
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                    type: 'shadow'
-                },
-                backgroundColor: "rgb(0 0 0 / 40%)",
-                borderColor: 'none',
-                formatter: function (params) {
-                    let total = params[0].value + params[1].value;
-                    var html = "";
-                    html = `<div
-                    style="font-size: 14px;font-family: Microsoft YaHei;color: #FFFFFF;width: 206px;border-radius: 10px;box-sizing: border-box;position: relative;">
-                    <div>`+ params[0].axisValue + `:</div>
-                    <div>`+ total.toLocaleString() + `人次<span style="margin-left:20px;"></span></div>
-                    <div style="width: 272px;height: 1px;background:rgb(255 255 255 / 32%);margin: 10px 0;"></div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[0].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[0].seriesName + `:
-                        `+ params[0].value.toLocaleString() + `人次</span>
-                    </div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[1].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[1].seriesName + `:
-                        `+ params[1].value.toLocaleString() + `人次</span><span style="margin-left:20px;"></span>
-                    </div>
-                </div>`
-                    return html;
-                },
-                confine: true
-            },
-            xAxis: {
-                type: 'category',
-                data: ['接待海内外游客', '过夜游客'],
-                axisLabel: {
-                    show: true,
-                    rotate: -30,
-                    textStyle: {
-                        color: '#333',  //更改坐标轴文字颜色
-                        fontSize: 14      //更改坐标轴文字大小
-                    }
-                },
-                isTick: {
-                    show: true  //坐标轴刻度线
-                },
-                axisLine: { //轴线
-                    show: true
-                },
-                splitLine: { //网格线
-                    show: true
-                },
-            },
-            yAxis: {
-                type: 'value',
-                min: 0,
-                max: 5000000,
-                interval: 1000000,
-                axisLabel: {
-                    formatter: '{value}(人次)'
-                },
-                axisTick: {
-                    show: true  //坐标轴刻度线
-                },
-                axisLine: { //轴线
-                    show: true
-                },
-                splitLine: { //网格线
-                    show: true
-                }
-            },
-            series: [
-                {
-                    name: '海外游客',
-                    barWidth: 60,
-                    data: [0, 0],
-                    type: 'bar',
-                    itemStyle: {
-                        color: '#A7D0FD'
-                    }
-                },
-                //4256415 225424 322450 31012
-                //31762696 1724264 2370899 286838
-                {
-                    name: '海内游客',
-                    barWidth: 60,
-                    data: data,
-                    type: 'bar',
-                    barGap: '-100%',//移动第二个柱子的位置实现重叠
-                    z: '-1',//改变这根柱子的层级使这根柱子在下面,
-                    itemStyle: {
-                        color: '#509EF3'
-                    }
+  var chartDom = document.getElementById("zsrEchart");
+  var myChart = echarts.init(chartDom);
+  var alldata = [
+    [3418160, 352098],
+    [33427158, 2604714],
+  ];
+  var option;
+  var data = alldata[0];
+  option = {
+    title: {
+      text: "旅游总收入",
+      textStyle: {
+        fontSize: 14,
+      },
+    },
+    tooltip: {
+      trigger: "axis",
+      confine: true,
+      axisPointer: {
+        type: "cross",
+        crossStyle: {
+          color: "#999",
+        },
+      },
+    },
+    grid: {
+      containLabel: true,
+    },
+    legend: {
+      data: ["旅游总收入"],
+    },
+    xAxis: [
+      {
+        type: "category",
+        data: [
+          "2023年1月",
+          "2023年2月",
+          "2023年3月",
+          "2023年4月",
+          "2023年5月",
+          "2023年6月",
+          "2023年7月",
+          "2023年8月",
+          "2023年9月",
+          "2023年10月",
+        ],
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: "value",
+        name: "总收入",
+        axisLabel: {
+          formatter: "{value} 万元",
+        },
+      },
+      {
+        type: "value",
+        name: "同比增减",
+        interval: 20,
+        max: 100,
+        axisLabel: {
+          formatter: "{value} %",
+        },
+      },
+    ],
+    series: [
+      {
+        name: "旅游总收入",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 万元";
+          },
+        },
+        data: [
+          251414, 304154, 322454, 308451, 424215, 298541, 353411, 296332,
+          384412, 311452,
+        ],
+      },
+      {
+        name: "旅游总收入同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [
+          38.55, 24.93, 34.84, 20.75, 26.53, 20.44, 15.02, 20.03, 19.22, 8.82,
+        ],
+      },
+    ],
+  };
 
-                }
-            ]
-        };
-        myChart.clear();
-        option && myChart.setOption(option);
-    })
-    $('.cumulat').click(function () {
-        $('.cumulat').addClass('click');
-        $('.thisMonth').removeClass('click');
-        var shbzTableHtml = `
-        <ul class="title">
-        <li style="width: 111px;">范围</li>
-        <li><span>旅游总收入</span><span>(万元)</span></li>
-        <li><span>旅游从业人数</span><span>(人)</span></li>
-        </ul>
-                    <ul class="number">
-                         <li style="width: 110px;">截至2023年8月累计</li>
-                       <li>2548972</li>
-                       <li>535711</li>
-                    </ul>
-                `
-        $(".wsylTable").empty().html(shbzTableHtml)
-        var option;
-        var data = alldata[1]
-        option = {
-            grid: {
-                // 网格线配置
-                show: true,
-                lineStyle: {
-                    color: ["#e9e9e9"],
-                    width: 1,
-                    type: "solid",
-                },
-                left: 110
-            },
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                    type: 'shadow'
-                },
-                backgroundColor: "rgb(0 0 0 / 40%)",
-                borderColor: 'none',
-                formatter: function (params) {
-                    let total = params[0].value + params[1].value;
-                    
-                    var html = "";
-                    html = `<div
-                    style="font-size: 14px;font-family: Microsoft YaHei;color: #FFFFFF;width: 206px;border-radius: 10px;box-sizing: border-box;position: relative;">
-                    <div>`+ params[0].axisValue + `:</div>
-                    <div>`+ total.toLocaleString() + `人次<span style="margin-left:20px;"></span></div>
-                    <div style="width: 272px;height: 1px;background:rgb(255 255 255 / 32%);margin: 10px 0;"></div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[0].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[0].seriesName + `:
-                        `+ params[0].value.toLocaleString() + `人次</span>
-                    </div>
-                    <div><span
-                            style="width: 11px;height: 11px;background: `+ params[1].color + `;border-radius: 6px;display:inline-block;margin-right:5px;"></span><span>` + params[1].seriesName + `:
-                        `+ params[1].value.toLocaleString() + `人次</span><span style="margin-left:20px;"></span>
-                    </div>
-                </div>`
-                    return html;
-                },
-                confine: true
-            },
-            xAxis: {
-                type: 'category',
-                data: ['接待海内外游客', '过夜游客'],
-                axisLabel: {
-                    show: true,
-                    rotate: -30,
-                    textStyle: {
-                        color: '#333',  //更改坐标轴文字颜色
-                        fontSize: 14      //更改坐标轴文字大小
-                    }
-                },
-                isTick: {
-                    show: true  //坐标轴刻度线
-                },
-                axisLine: { //轴线
-                    show: true
-                },
-                splitLine: { //网格线
-                    show: true
-                },
-            },
-            yAxis: {
-                type: 'value',
-                min: 0,
-                max: 35000000,
-                interval: 10000000,
-                axisLabel: {
-                    formatter: '{value}(人次)'
-                },
-                axisTick: {
-                    show: true  //坐标轴刻度线
-                },
-                axisLine: { //轴线
-                    show: true
-                },
-                splitLine: { //网格线
-                    show: true
-                }
-            },
-            series: [
-                {
-                    name: '海外游客',
-                    barWidth: 60,
-                    data: [0, 0],
-                    type: 'bar',
-                    itemStyle: {
-                        color: '#A7D0FD'
-                    }
-                },
-                //4256415 225424 322450 31012
-                //31762696 1724264 2370899 286838
-                {
-                    name: '海内游客',
-                    barWidth: 60,
-                    data: data,
-                    type: 'bar',
-                    barGap: '-100%',//移动第二个柱子的位置实现重叠
-                    z: '-1',//改变这根柱子的层级使这根柱子在下面,
-                    itemStyle: {
-                        color: '#509EF3'
-                    }
+  option && myChart.setOption(option);
 
-                }
-            ]
-        };
-        myChart.clear();
-        option && myChart.setOption(option);
-    })
+  var chartDom = document.getElementById("cyrsEchart");
+  var myChart = echarts.init(chartDom);
+  var alldata = [
+    [3418160, 352098],
+    [33427158, 2604714],
+  ];
+  var option;
+  var data = alldata[0];
+  option = {
+    title: {
+      text: "旅游从业人数",
+      textStyle: {
+        fontSize: 14,
+      },
+    },
+    tooltip: {
+      trigger: "axis",
+      confine: true,
+      axisPointer: {
+        type: "cross",
+        crossStyle: {
+          color: "#999",
+        },
+      },
+    },
+    grid: {
+      containLabel: true,
+    },
+    legend: {
+      data: ["旅游从业人数"],
+    },
+    xAxis: [
+      {
+        type: "category",
+        data: [
+          "2023年1月",
+          "2023年2月",
+          "2023年3月",
+          "2023年4月",
+          "2023年5月",
+          "2023年6月",
+          "2023年7月",
+          "2023年8月",
+          "2023年9月",
+          "2023年10月",
+        ],
+        axisPointer: {
+          type: "shadow",
+        },
+      },
+    ],
+    yAxis: [
+      {
+        type: "value",
+        name: "旅游从业人数",
+        axisLabel: {
+          formatter: "{value} 人次",
+        },
+      },
+      {
+        type: "value",
+        name: "同比增减",
+        interval: 5,
+        max: 30,
+        axisLabel: {
+          formatter: "{value} %",
+        },
+      },
+    ],
+    series: [
+      {
+        name: "旅游从业人数",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 人次";
+          },
+        },
+        data: [
+          33102, 33104, 33245, 33447, 33541, 33654, 33145, 33210, 32010, 32511,
+        ],
+      },
+      {
+        name: "旅游直接从业人数",
+        type: "bar",
+        yAxisIndex: 0,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " 万元";
+          },
+        },
+        data: [6642, 6647, 6721, 6842, 6847, 6719, 6641, 6652, 6622, 6421],
+      },
+      {
+        name: "旅游从业人数同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [3.12, 3.05, 3.54, 4.2, 4.86, 5.23, 3.67, 5.57, 3.22, 4.07],
+      },
+      {
+        name: "旅游直接从业人数同比增减",
+        type: "line",
+        yAxisIndex: 1,
+        tooltip: {
+          valueFormatter: function (value) {
+            return value + " %";
+          },
+        },
+        data: [3.46, 3.46, 4.69, 6.66, 6.98, 5.15, 4.03, 4.76, 4.88, 2.88],
+      },
+    ],
+  };
 
+  option && myChart.setOption(option);
 }

+ 46 - 0
nngkxxdp/src/main/resources/static/natj/dataCenter/js/employment.js

@@ -0,0 +1,46 @@
+function employment() {
+  var chartDom = document.getElementById("jysychart");
+  var myChart = echarts.init(chartDom);
+  var option;
+  myChart.clear();
+  option = {
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "shadow",
+      },
+    },
+    legend: {},
+    grid: {
+      left: "3%",
+      right: "4%",
+      bottom: "3%",
+      containLabel: true,
+    },
+    xAxis: {
+      type: "category",
+      boundaryGap: [0, 0.01],
+    },
+    yAxis: {
+      type: "value",
+      data: ["Brazil", "Indonesia", "USA", "India", "China", "World"],
+    },
+    series: [
+      {
+        name: "城镇新增就业人数",
+        type: "bar",
+        data: [18203, 23489, 29034, 104970, 131744, 630230],
+        itemStyle:{
+          color:'#509EF3'
+        }
+      },
+      {
+        name: "城镇登记失业人员就业人数",
+        type: "bar",
+        data: [19325, 23438, 31000, 121594, 134141, 681807],
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+}

+ 118 - 0
nngkxxdp/src/main/resources/static/natj/dataCenter/js/skills.js

@@ -0,0 +1,118 @@
+function skills() {
+  var chartDom = document.getElementById("skills1");
+  var myChart = echarts.init(chartDom);
+  var option;
+  myChart.clear();
+  option = {
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "shadow",
+      },
+    },
+    legend: {
+      show: false,
+    },
+    grid: {
+      left: "3%",
+      right: "4%",
+      bottom: "3%",
+      containLabel: true,
+    },
+    xAxis: {
+      type: "category",
+      data: ["2022年全年", "2023年一季度", "2023年二季度", "2023年三季度"],
+    },
+    yAxis: {
+      type: "value",
+      data: ["Brazil", "Indonesia", "USA", "India", "China", "World"],
+    },
+    series: [
+      {
+        name: "城镇新增就业人数",
+        type: "bar",
+        data: [18203, 23489, 29034, 104970, 131744, 630230],
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+
+  var chartDom = document.getElementById("skills2");
+  var myChart = echarts.init(chartDom);
+  var option;
+  myChart.clear();
+  option = {
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "shadow",
+      },
+    },
+    legend: {
+      show: false,
+    },
+    grid: {
+      left: "3%",
+      right: "4%",
+      bottom: "3%",
+      containLabel: true,
+    },
+    xAxis: {
+      type: "category",
+      data: ["2022年全年", "2023年一季度", "2023年二季度", "2023年三季度"],
+    },
+    yAxis: {
+      type: "value",
+      data: ["Brazil", "Indonesia", "USA", "India", "China", "World"],
+    },
+    series: [
+      {
+        name: "城镇新增就业人数",
+        type: "bar",
+        data: [18203, 23489, 29034, 104970, 131744, 630230],
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+
+  var chartDom = document.getElementById("skills3");
+  var myChart = echarts.init(chartDom);
+  var option;
+  myChart.clear();
+  option = {
+    tooltip: {
+      trigger: "axis",
+      axisPointer: {
+        type: "shadow",
+      },
+    },
+    legend: {
+      show: false,
+    },
+    grid: {
+      left: "3%",
+      right: "4%",
+      bottom: "3%",
+      containLabel: true,
+    },
+    xAxis: {
+      type: "category",
+      data: ["2022年全年", "2023年一季度", "2023年二季度", "2023年三季度"],
+    },
+    yAxis: {
+      type: "value",
+      data: ["Brazil", "Indonesia", "USA", "India", "China", "World"],
+    },
+    series: [
+      {
+        name: "城镇新增就业人数",
+        type: "bar",
+        data: [18203, 23489, 29034, 104970, 131744, 630230],
+      },
+    ],
+  };
+
+  option && myChart.setOption(option);
+}

+ 2 - 2
nngkxxdp/src/main/resources/static/natj/dataCenter/js/socialSecurity.js

@@ -41,8 +41,8 @@ function socialSecurity() {
         "closeRate": 65
     }]
     // 初始化年份
-    console.log(document.getElementById("year"))
-    document.getElementById("year").value='2023年截至6月';
+    // console.log(document.getElementById("year"))
+    // document.getElementById("year").value='2023年截至6月';
     $('#year').on('change', function () {
         var value = $(this).val();
         for (var i = 0; i < jsonData.length; i++) {