feat：更新移动端代码

css/style.css

@@ -242,7 +242,7 @@ sidebar-preview-menu>.vertical-menu sidebar-menu-items-collection sidebar-menu-i
 }
 
 sidebar-menu-item>li icon>i.material-icons[icon-ligature="dashboard"] {
-    background: url(../img/icon/icon_data@2x.png?4)no-repeat;
+    background: url(../img/icon/icon_data@2x.svg?5)no-repeat;
     background-size: 100% 100%;
     width: 60px;
     height: 60px;
@@ -250,12 +250,12 @@ sidebar-menu-item>li icon>i.material-icons[icon-ligature="dashboard"] {
 }
 
 .vertical-menu sidebar-menu-item.active>li icon>i.material-icons[icon-ligature="dashboard"] {
-    background: url(../img/icon/icon_data@2_1.png?4)no-repeat;
+    background: url(../img/icon/icon_data@2_1.svg?5)no-repeat;
     background-size: 100% 100%;
 }
 
 sidebar-menu-item>li icon>i.material-icons[icon-ligature="remove_red_eye"] {
-    background: url(../img/icon/icon_eye@2x.png?4)no-repeat;
+    background: url(../img/icon/icon_eye@2x.svg?5)no-repeat;
     background-size: 100% 100%;
     width: 60px;
     height: 60px;
@@ -263,12 +263,12 @@ sidebar-menu-item>li icon>i.material-icons[icon-ligature="remove_red_eye"] {
 }
 
 .vertical-menu sidebar-menu-item.active>li icon>i.material-icons[icon-ligature="remove_red_eye"] {
-    background: url(../img/icon/icon_eye@2x_1.png?4)no-repeat;
+    background: url(../img/icon/icon_eye@2x_1.svg?5)no-repeat;
     background-size: 100% 100%;
 }
 
 sidebar-menu-item>li icon>i.material-icons[icon-ligature="location_on"] {
-    background: url(../img/icon/icon_element@2x.png?4)no-repeat;
+    background: url(../img/icon/icon_element@2x.svg?5)no-repeat;
     background-size: 100% 100%;
     width: 60px;
     height: 60px;
@@ -276,12 +276,12 @@ sidebar-menu-item>li icon>i.material-icons[icon-ligature="location_on"] {
 }
 
 .vertical-menu sidebar-menu-item.active>li icon>i.material-icons[icon-ligature="location_on"] {
-    background: url(../img/icon/icon_element@2x_1.png?4)no-repeat;
+    background: url(../img/icon/icon_element@2x_1.svg?5)no-repeat;
     background-size: 100% 100%;
 }
 
 sidebar-menu-item>li icon>i.material-icons[icon-ligature="mode_edit"] {
-    background: url(../img/icon/icon_EditMode_1.png?4)no-repeat;
+    background: url(../img/icon/icon_EditMode_1.svg?5)no-repeat;
     background-size: 100% 100%;
     width: 60px;
     height: 60px;
@@ -289,12 +289,12 @@ sidebar-menu-item>li icon>i.material-icons[icon-ligature="mode_edit"] {
 }
 
 .vertical-menu sidebar-menu-item.active>li icon>i.material-icons[icon-ligature="mode_edit"] {
-    background: url(../img/icon/icon_EditMode.png?4)no-repeat;
+    background: url(../img/icon/icon_EditMode.svg?5)no-repeat;
     background-size: 100% 100%;
 }
 
 sidebar-menu-item>li icon>i.material-icons[icon-ligature="straighten"] {
-    background: url(../img/icon/icon_measure@2x.png?4)no-repeat;
+    background: url(../img/icon/icon_measure@2x.svg?5)no-repeat;
     background-size: 100% 100%;
     width: 60px;
     height: 60px;
@@ -302,12 +302,12 @@ sidebar-menu-item>li icon>i.material-icons[icon-ligature="straighten"] {
 }
 
 .vertical-menu sidebar-menu-item.active>li icon>i.material-icons[icon-ligature="straighten"] {
-    background: url(../img/icon/icon_measure@2x_1.png)no-repeat;
+    background: url(../img/icon/icon_measure@2x_1.svg)no-repeat;
     background-size: 100% 100%;
 }
 
 sidebar-menu-item>li icon>i.fa-thumb-tack[iv-tooltip="坐标"] {
-    background: url(../img/icon/icon_location@2x.png?4)no-repeat;
+    background: url(../img/icon/icon_location@2x.svg?5)no-repeat;
     background-size: 100% 100%;
     width: 60px;
     height: 60px;
@@ -315,12 +315,12 @@ sidebar-menu-item>li icon>i.fa-thumb-tack[iv-tooltip="坐标"] {
 }
 
 .vertical-menu sidebar-menu-item.active>li icon>i.fa-thumb-tack[iv-tooltip="坐标"] {
-    background: url(../img/icon/icon_location@2x_1.png?4)no-repeat;
+    background: url(../img/icon/icon_location@2x_1.svg?5)no-repeat;
     background-size: 100% 100%;
 }
 
 sidebar-menu-item>li icon>i.fa-thumb-tack[iv-tooltip="设置"] {
-    background: url(../img/icon/icon_load_n.png?4)no-repeat;
+    background: url(../img/icon/icon_load_n.svg?5)no-repeat;
     background-size: 100% 100%;
     width: 60px;
     height: 60px;
@@ -328,7 +328,7 @@ sidebar-menu-item>li icon>i.fa-thumb-tack[iv-tooltip="设置"] {
 }
 
 .vertical-menu sidebar-menu-item.active>li icon>i.fa-thumb-tack[iv-tooltip="设置"] {
-    background: url(../img/icon/icon_load_s.png?4)no-repeat;
+    background: url(../img/icon/icon_load_s.svg?5)no-repeat;
     background-size: 100% 100%;
 }
 
@@ -1818,7 +1818,7 @@ floor-changer .btn-group-vertical {
 }
 
 button[title="隐藏所选"] .material-icons {
-    background: url(../img/icon/icon_hide.png?4)no-repeat;
+    background: url(../img/icon/icon_hide.png?5)no-repeat;
     background-size: 100% 100%;
     width: 20px;
     height: 20px;
@@ -1826,7 +1826,7 @@ button[title="隐藏所选"] .material-icons {
 }
 
 button[title="分享所选"] .material-icons {
-    background: url(../img/icon/share.png?4)no-repeat;
+    background: url(../img/icon/share.png?5)no-repeat;
     background-size: 100% 100%;
     width: 20px;
     height: 20px;
@@ -1834,7 +1834,7 @@ button[title="分享所选"] .material-icons {
 }
 
 button[title="删除所选"] .material-icons {
-    background: url(../img/icon/icon_del.png?4)no-repeat;
+    background: url(../img/icon/icon_del.png?5)no-repeat;
     background-size: 100% 100%;
     width: 20px;
     height: 20px;
@@ -1842,7 +1842,7 @@ button[title="删除所选"] .material-icons {
 }
 
 button[title="保存所选"] .material-icons {
-    background: url(../img/icon/icon_save.png?4)no-repeat;
+    background: url(../img/icon/icon_save.png?5)no-repeat;
     background-size: 100% 100%;
     width: 20px;
     height: 20px;
@@ -2149,4 +2149,262 @@ sidebar-menu #view-menu #pointcloud-menu #pointcloud-options #pointcloud-pane>di
 /*  */
 li[ng-click="vm.switchUnit(unit, vm.UoMSystem.IMPERIAL)"]{
   display: none;
-}
+}
+
+/* 移动端公共样式 */
+@media screen and (max-width: 500px) {
+  #sliderBtn{
+    width: 40px;
+    height: 40px;
+    position: fixed;
+    top: 10px;
+    left: 10px;
+    z-index: 10;
+    transform: rotate(0deg);
+    /* animation: all 1s; */
+    transition: all 0.3s;
+    border-radius: 50%
+  }
+  #sliderBtn.isHide{
+    transform: rotate(180deg);
+    /* transform: rotate(0deg); */
+    background:rgba(0, 0, 0, 0.5);
+  
+  }
+  #sliderBtn img{
+    width: 20px;
+    height: 20px;
+    margin: 10px auto;
+    display: block;
+  }
+}
+.glyphicon{
+  top: 0px !important;
+}
+
+/* 移动端mobile */
+.indoorViewer.mobile .vertical-menu-content>sidebar-menu-items-collection >.panel-autoscroll{
+  padding-top: 60px;
+}
+
+.indoorViewer.mobile .non-mobile{
+  display: block !important;
+}
+.indoorViewer.mobile search-input[ng-if="vm.SearchService.isSearchBoxVisible()"]{
+  /* display: none; */
+}
+.indoorViewer.mobile #left-panel-pois{
+    /* display: none; */
+    border: none;
+}
+.indoorViewer.mobile left-panel .threeD-overlay{
+  /* left: 50%;
+  transform: translateX(-50%); */
+  margin: 20px auto !important;
+  position: relative;
+}
+ .indoorViewer.mobile .ic_svg.clickable.border-left[alt="请输入热点名称进行搜索"]{
+  display: none;
+}
+.indoorViewer.mobile .search-box #searchInput:not(.search-box-radius-poi-selected){
+  display: none;
+} 
+.indoorViewer.mobile .search-box #searchInput.padding-left-menu-icon{
+  display: none;
+}
+
+.indoorViewer.mobile navbar-menu{
+  display: none;
+}
+.indoorViewer.mobile #insetPanel{
+  visibility: visible !important;
+}
+
+.indoorViewer.mobile sidebar-preview-menu>.vertical-menu{
+  top: 0;
+  left: 0px;
+}
+.indoorViewer.mobile sidebar-preview-menu>.vertical-menu.isHide{
+  left: -60px;
+}
+.indoorViewer.mobile sidebar-menu-items-collection:not(.parent):not(.child)>.panel-autoscroll>ul>sidebar-menu-item>li.sidebar-menu-item-user{
+  display: none;
+}
+.indoorViewer.mobile #insetPanel .swap-views-button{
+  top: 6px;
+  right: 34px;
+  z-index: 999;
+  width: 0;
+}
+.indoorViewer.mobile #insetPanel .swap-views-button .glyphicon-resize-full:before{
+  width: 16px;
+  height: 16px;
+}
+.indoorViewer.mobile .swap-views-button span{
+  /* transform: scale(.8); */
+  background: rgba(0, 0, 0, 0.5);
+
+  padding: 7px;
+  border-radius: 50%;
+}
+
+.indoorViewer.mobile sidebar-menu>.vertical-menu{
+  top: 0 !important;
+  z-index: 99999;
+  width: 80%;
+}
+.indoorViewer.mobile .vertical-menu .vertical-menu-heading .menu-close-button{
+  z-index: 9999999;
+  /* background: red; */
+  /* left: 70%; */
+}
+/* .indoorViewer.mobile sidebar-menu-item>li icon>i.material-icons{
+  width: 40px;
+  height: 40px;
+} */
+.indoorViewer.mobile .vertical-menu .vertical-menu-heading{
+  min-width: 100px !important;
+}
+.indoorViewer.mobile sidebar-menu-items-collection .site-model-button .btn-borderless{
+  width: auto;
+  height: auto;
+}
+.indoorViewer.mobile site-model-collection .dataset-grp-toolbar .fa{
+  width: auto;
+  height: auto;
+}
+
+/* .indoorViewer.mobile .vertical-viewport-separator .btn-resizer {
+  display: block !important;
+} */
+
+.indoorViewer.mobile  #results-list.route-mode{
+  padding-top: 150px;
+  padding-bottom: 20px;
+}
+.indoorViewer.mobile #results-list .list-group{
+  padding-bottom: 20px;
+}
+.indoorViewer.mobile #results-list.show{
+  left: 0px!important;
+}
+.indoorViewer.mobile .route-box .dropdown-menu{
+  left: 50% !important;
+  transform: translateX(-47%);
+}
+.indoorViewer.mobile .route-box .route-input-start+.dropdown-menu{
+  top: 209%!important;
+}
+
+
+
+
+/* mobile-small */
+
+.indoorViewer.mobile-small .vertical-menu-content>sidebar-menu-items-collection >.panel-autoscroll{
+  padding-top: 60px;
+}
+.indoorViewer.mobile-small .non-mobile{
+  display: block !important;
+}
+.indoorViewer.mobile-small search-input[ng-if="vm.SearchService.isSearchBoxVisible()"]{
+  /* display: none; */
+}
+.indoorViewer.mobile-small #left-panel-pois{
+    /* display: none; */
+    border: none;
+}
+.indoorViewer.mobile-small left-panel .threeD-overlay{
+  /* left: 50%;
+  transform: translateX(-50%); */
+  margin: 20px auto !important;
+  position: relative;
+}
+ .indoorViewer.mobile-small .ic_svg.clickable.border-left[alt="请输入热点名称进行搜索"]{
+  display: none;
+}
+.indoorViewer.mobile-small .search-box #searchInput:not(.search-box-radius-poi-selected){
+  display: none;
+} 
+.indoorViewer.mobile-small .search-box #searchInput.padding-left-menu-icon{
+  display: none;
+}
+
+.indoorViewer.mobile-small navbar-menu{
+  display: none;
+}
+.indoorViewer.mobile-small #insetPanel{
+  visibility: visible !important;
+}
+
+.indoorViewer.mobile-small sidebar-preview-menu>.vertical-menu{
+  top: 0;
+  left: 0px;
+}
+
+.indoorViewer.mobile-small  sidebar-preview-menu>.vertical-menu.isHide{
+  left: -60px;
+}
+.indoorViewer.mobile-small sidebar-menu-items-collection:not(.parent):not(.child)>.panel-autoscroll>ul>sidebar-menu-item>li.sidebar-menu-item-user{
+  display: none;
+}
+.indoorViewer.mobile-small #insetPanel .swap-views-button{
+  top: 6px;
+  right: 34px;
+  z-index: 999;
+  width: 0;
+}
+.indoorViewer.mobile-small #insetPanel .swap-views-button .glyphicon-resize-full:before{
+  width: 16px;
+  height: 16px;
+}
+.indoorViewer.mobile-small .swap-views-button span{
+  /* transform: scale(.8); */
+  background: rgba(0, 0, 0, 0.5);
+
+  padding: 7px;
+  border-radius: 50%;
+}
+
+.indoorViewer.mobile-small sidebar-menu>.vertical-menu{
+  top: 0 !important;
+  z-index: 99999;
+  width: 80%;
+}
+.indoorViewer.mobile-small .vertical-menu .vertical-menu-heading .menu-close-button{
+  z-index: 9999999;
+  /* background: red; */
+  /* left: 70%; */
+}
+/* .indoorViewer.mobile sidebar-menu-item>li icon>i.material-icons{
+  width: 40px;
+  height: 40px;
+} */
+.indoorViewer.mobile-small .vertical-menu .vertical-menu-heading{
+  min-width: 100px !important;
+}
+.indoorViewer.mobile-small sidebar-menu-items-collection .site-model-button .btn-borderless{
+  width: auto;
+  height: auto;
+}
+.indoorViewer.mobile-small site-model-collection .dataset-grp-toolbar .fa{
+  width: auto;
+  height: auto;
+}
+.indoorViewer.mobile-small  #results-list.route-mode{
+  padding-top: 150px;
+  padding-bottom: 20px;
+}
+.indoorViewer.mobile-small #results-list .list-group{
+  padding-bottom: 20px;
+}
+.indoorViewer.mobile-small #results-list.show{
+  left: 0px!important;
+}
+.indoorViewer.mobile-small .route-box .dropdown-menu{
+  left: 50% !important;
+  transform: translateX(-47%);
+}
+.indoorViewer.mobile-small .route-box .route-input-start+.dropdown-menu{
+  top: 209%!important;
+}

index.html

@@ -3,6 +3,7 @@
 
 <head>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width,user-scalable=no,minimum-scale=1,maximum-scale=1">
     <link rel="icon" href="favicon.ico" type="image/x-icon">
     <title>@title</title>
     <style>
@@ -23,13 +24,14 @@
 <script type="text/javascript">
     const ossPrefix = 'https://laser-oss.4dkankan.com/data/';
     const ossPrefixDep = 'https://laser-oss.4dkankan.com/public/';
-    const sceneNum = '@replace';
+    // const sceneNum = '@replace';
     // const sceneNum = 't-vZkqRV8';
     // const sceneNum = 't-iksBApb';
-    // const sceneNum = 't-2XuBP3o';
+    // const sceneNum = 't-UqZg8Au';
 </script>
 <script src="https://laser-oss.4dkankan.com/public/bus/bus.js"></script>
 <script src="https://laser-oss.4dkankan.com/public/main.js?v=21"></script>
+<!-- <script src="./main.js?v=21"></script> -->
 
 <script type="text/javascript" src="https://laser-oss.4dkankan.com/public/js/OBJExporter.js"></script>
 <script type="text/javascript" src="https://laser-oss.4dkankan.com/public/js/Animation.js"></script>
@@ -226,6 +228,8 @@
 <body>
     <indoorviewer style="height: 100%"></indoorviewer>
     <div id="curscroll" style="position:absolute;visibility:hidden;padding: 2px 10px;z-index:2000"></div>
+    <div id="sliderBtn">
+      <img src="https://laser-oss.4dkankan.com/public/3e431823cfdc005a6f586ce9ac2c1f2b.ic_close_sideMenu.svg">
+    </div>
 </body>
-
 </html>

js/index.js

@@ -2,7 +2,6 @@
 //  const tokenKry = 'ls.' + origin + '/#JWT'
 //  const token = getQueryVariable('token')
 //  localStorage.setItem(tokenKry, token)
-
 function getQueryVariable(variable) {
     var query = window.location.search.substring(1);
     var vars = query.split("&");
@@ -18,5 +17,10 @@ window.onload = function() {
     $('.glyphicon-resize-full').bind('click', function(params) {
         $(this).toggleClass('active')
     })
+    $('#sliderBtn').bind('click', function() {
+        $(this).toggleClass('isHide')
+        $('.vertical-menu').toggleClass('isHide')
+    })
+  
 
 }