style: --

scene/public/static/css/main.css

@@ -7012,11 +7012,11 @@ a.hasHover.tag-link:hover {
     }
     #play, #pause {
         width: 50px;
-        padding-bottom: 10px;
+        margin-bottom: 10px;
     }
     #gui-modes-map>div[rel] {
         width: 50px;
-        padding-bottom: 10px;
+        margin-bottom: 10px;
     }
     .progressbar {
         width: 70%;

scene/src/views/gui/menu.vue

@@ -30,7 +30,7 @@
           >
             <!-- 鼠标移入的显示 -->
             <div class="hoverTit" v-show="!isGuideOpen">自动导览</div>
-            <div class="guildeTip" v-if="isGuideOpen && guideStep == 2">
+            <div class="guildeTip" v-if="isGuideOpen">
               <div class="play-text">开始/暂停自动漫游</div>
               <img
                 class="guide-line"
@@ -56,7 +56,7 @@
           <div id="pause" class="ui-icon" style="display: none">
             <!-- 鼠标移入的显示 -->
             <div class="hoverTit" v-show="!isGuideOpen">自动导览</div>
-            <div class="guildeTip" v-if="isGuideOpen && guideStep == 2">
+            <div class="guildeTip" v-if="isGuideOpen">
               <div class="play-text">开始/暂停自动漫游</div>
               <img
                 class="guide-line"
@@ -106,7 +106,7 @@
             >
               <!-- 鼠标移入的显示 -->
               <div class="hoverTit" v-show="!isGuideOpen">导览列表</div>
-              <div class="guildeTip" v-if="isGuideOpen && guideStep == 2">
+              <div class="guildeTip" v-if="isGuideOpen">
                 <div>查看导览列表</div>
                 <img
                   class="guide-line"
@@ -139,8 +139,8 @@
             >
               <!-- 鼠标移入的显示 -->
               <div class="hoverTit" v-show="!isGuideOpen">全景漫游</div>
-              <div class="guildeTip" v-if="isGuideOpen && guideStep == 2">
-                <div>点击地面坐标<br>自主漫游</div>
+              <div class="guildeTip" v-if="isGuideOpen">
+                <div>点击地面坐标自主漫游</div>
                 <!-- <div>自主漫游</div> -->
                 <img
                   class="guide-line"
@@ -174,7 +174,7 @@
             >
               <!-- 鼠标移入的显示 -->
               <div class="hoverTit" v-show="!isGuideOpen">三维视觉</div>
-              <div class="guildeTip" v-if="isGuideOpen && guideStep == 2">
+              <div class="guildeTip" v-if="isGuideOpen">
                 <div>查看三维模型</div>
                 <img
                   class="guide-line"
@@ -207,7 +207,7 @@
             >
               <!-- 鼠标移入的显示 -->
               <div class="hoverTit" v-show="!isGuideOpen">平面视觉</div>
-              <div class="guildeTip" v-if="isGuideOpen && guideStep == 2">
+              <div class="guildeTip" v-if="isGuideOpen">
                 <div>查看平面地图</div>
                 <img
                   class="guide-line"
@@ -287,10 +287,9 @@
 
       <div
         class="begin-btn"
-        :class="{ 'nextStep': guideStep === 1 ,'knowBtn': guideStep === 3 || guideStep === 2}"
-        @click="guideStep == 3 ? (isGuideOpen = false) : (guideStep ++) "
+        @click="isGuideOpen = false"
       >
-        {{ guideStep != 3 ? "下一步" : "我知道了" }}
+        我知道了
       </div>
     </div>
 
@@ -376,7 +375,7 @@
           <div
             class="guildeTip right-mobile"
             style="transform: translateX(-30%)"
-            v-if="isGuideOpen && guideStep == 3"
+            v-if="isGuideOpen"
           >
             <div>清空屏幕内容</div>
             <img
@@ -441,8 +440,7 @@ export default {
       isGuideOpen: true,
       guideStep: 2,
       is2Ceng: false,
-      is1Ceng: false
-      
+      is1Ceng: false,
     };
   },
   watch: {},
@@ -618,14 +616,16 @@ export default {
 .guildeTip {
   position: absolute;
   bottom: 48px;
-  font-size: 18px;
-  white-space: nowrap;
+  font-size: 14px;
   z-index: 70;
   color: #cbb18e;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
+  white-space: nowrap;
+  text-align: center;
+
   .play-text{
     transform: translateX(25%);
   }
@@ -959,10 +959,10 @@ export default {
     opacity: 0 !important;
   }
   .guildeTip{
-    bottom: 15px;
     flex-direction: row-reverse;
+    top: 50%;
     right: 0;
-    transform: translateX(100%);
+    transform: translate(100%, -50%);
     font-size: 14px;    
     .play-text{
       transform: translateX(0%);
@@ -973,10 +973,24 @@ export default {
       height: 1px !important;
       margin: auto 5px;
     }
+    img {
+      display: none;
+    }
+    &::after {
+      content: '';
+      margin-right: 5px;
+      width: 30px;
+      height: 11px;
+      background: url('../../assets/img/bd.png') no-repeat center right / contain;
+    }
   }
   .right-mobile{
     flex-direction: row;
-    bottom: 2px;
+    &::after {
+      margin-right: unset;
+      margin-left: 5px;
+      transform: rotate(180deg);
+    }
   }
 
   .viewContainer {
@@ -1074,13 +1088,12 @@ export default {
         width: 100%;
         height: 100%;
         // padding: 25% 15%;
-        padding: 0 18%;
+        padding: 20px 18%;
         display: flex;
+        justify-content: flex-start;
         flex-direction: column;
-        justify-content: center;
         // align-items: center;
         color: #cbb18e;
-        padding-bottom: 10%;
 
         .box-item {
           display: flex;
@@ -1111,7 +1124,7 @@ export default {
         background: url(../../assets/img/beginBg.png);
         background-size: 100% 100%;
         position: absolute;
-        bottom: 15vh;
+        bottom: 37vh;
         left: 50%;
         transform: translateX(-50%);
         // line-height: 6vh;

tilt-model-web/staticData/data.js

@@ -64,7 +64,7 @@ const dataAll = {
       id:11,
       name:'下栅村金山巷12号商铺与货楼',
       desc:'下栅村金山巷12号商铺与货楼建于民国时期，商铺高两层，后方为存储商品的货楼。建筑整体比例匀称，外墙为抹灰批荡，建筑室内和建筑细部运用大量的西方元素，如西式山花等，装饰柱式展示出中西结合建筑的独特风格与美感，体现了珠海地区民国时期中西文化的交融，是研究珠海地区近现代商贸经济发展、聚落形态演变的重要实物遗存。',
-      images:['1.jpg','2.jpg','3.jpg','4.jpg','5.jpg','6.jpg']
+      images:['2.jpg','3.jpg','4.jpg','5.jpg','6.jpg']
     },
     {
       id:12,