From 9856effd543ac82d681992d115b16117c9a2ea02 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?home=E5=AD=99?= <1162067978@qq.com>
Date: Tue, 10 Jun 2025 18:33:41 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E6=95=B0=E6=8D=AE=E5=9B=BE=E7=89=87?=
 =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E6=9B=B4=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/page/largeScreen.vue  | 12 +++----
 src/views/page/largeScreen1.vue | 63 ++++++++++++++++++++-------------
 2 files changed, 44 insertions(+), 31 deletions(-)

diff --git a/src/views/page/largeScreen.vue b/src/views/page/largeScreen.vue
index 6947b88c..440f5f82 100644
--- a/src/views/page/largeScreen.vue
+++ b/src/views/page/largeScreen.vue
@@ -2218,15 +2218,15 @@ export default {
           left: 0;
           z-index: 99;
           -webkit-mask-image: linear-gradient(90deg,
-              transparent 22%,
+              transparent 0%,
               transparent 10%,
-              blue 30%,
-              blue 70%,
-              transparent 75%,
+              blue 20%,
+              blue 80%,
+              transparent 90%,
               transparent 100%);
 
           .map1 {
-            width: 70%;
+            width: 90%;
             height:90%;
             // background: url('../assets/img/map.png') center no-repeat;
             // background-size: 100% 100%;
@@ -2238,7 +2238,7 @@ export default {
             //     transparent 100%);
             -webkit-mask-image: linear-gradient(transparent 0%,
                 blue 8%,
-                blue 85%,
+                blue 92%,
                 transparent 100%);
             // transform: scale(0.6);
             position: absolute;
diff --git a/src/views/page/largeScreen1.vue b/src/views/page/largeScreen1.vue
index 2cfd4fa9..16841ce5 100644
--- a/src/views/page/largeScreen1.vue
+++ b/src/views/page/largeScreen1.vue
@@ -1406,7 +1406,7 @@ demo.onwheel = function(e) {
     }
   }
   
-  demo.style.transform = `scale(${scale})`;
+  demo.style.transform = `translate(-50%,-50%) scale(${scale})`;
 }
     }
   }
@@ -1574,7 +1574,7 @@ demo.onwheel = function(e) {
           // background-size: 100% 100%;
           -webkit-mask-image: linear-gradient(transparent 4%,
               blue 15%,
-              blue 86%,
+              blue 96%,
               transparent 100%);
           overflow: hidden;
           position: absolute;
@@ -1583,6 +1583,9 @@ demo.onwheel = function(e) {
             width: 100%;
             height: 100%;
             position: absolute;
+          left: 50%;
+          top: 50%;
+          transform: translate(-50%,-50%);
             -webkit-mask-image: linear-gradient(90deg,
                 transparent 0%,
                 blue 5%,
@@ -1593,9 +1596,9 @@ demo.onwheel = function(e) {
               width: 100%;
               height: 100%;
               -webkit-mask-image: linear-gradient(transparent 0%,
-                  blue 13%,
-                  blue 73%,
-                  transparent 97%);
+                  blue 4%,
+                  blue 96%,
+                  transparent 100%);
             }
 
             .pole_item,
@@ -1804,20 +1807,23 @@ demo.onwheel = function(e) {
           .drag_box1 {
             width: 100%;
             height: 100%;
-            position: absolute;
+                 position: absolute;
+          left: 50%;
+          top: 50%;
+          transform: translate(-50%,-50%);
             -webkit-mask-image: linear-gradient(90deg,
-                transparent 4%,
-                blue 18%,
-                blue 88%,
+                transparent 0%,
+                blue 4%,
+                blue 96%,
                 transparent 100%);
 
             .drag_img {
               width: 100%;
               height: 100%;
               -webkit-mask-image: linear-gradient(transparent 0%,
-                  blue 13%,
-                  blue 73%,
-                  transparent 97%);
+                  blue 4%,
+                  blue 96%,
+                  transparent 100%);
             }
 
             .pole_item_4 {
@@ -2068,16 +2074,19 @@ demo.onwheel = function(e) {
           .drag_box12,
           .drag_box13 {
             width: 100%;
-            height: auto;
+     
+            height:auto;
             position: absolute;
-            top: -95px;
-            // -webkit-mask-image: linear-gradient(
-            //  90deg,
-            //   transparent 0%,
-            //   blue 2%,
-            //   blue 97%,
-            //   transparent 99%
-            //  );
+          left: 50%;
+          top: 50%;
+          transform: translate(-50%,-50%);
+            -webkit-mask-image: linear-gradient(
+             90deg,
+              transparent 0%,
+              blue 2%,
+              blue 97%,
+              transparent 100%
+             );
            
             .drag_img {
               width: 100%;
@@ -2296,19 +2305,23 @@ demo.onwheel = function(e) {
             width: 100%;
             height: 100%;
             position: absolute;
+            
+          left: 50%;
+          transform: translate(-50%,-50%);
+          top: 50%;
             -webkit-mask-image: linear-gradient(90deg,
                 transparent 0%,
                 blue 5%,
                 blue 93%,
-                transparent 99%);
+                transparent 100%);
 
             .drag_img {
               width: 100%;
               height: 100%;
               -webkit-mask-image: linear-gradient(transparent 0%,
-                  blue 13%,
-                  blue 73%,
-                  transparent 97%);
+                  blue 4%,
+                  blue 96%,
+                  transparent 100%);
             }
 
             .pole_item {