yzt
2023-05-08 24e1c6a1c3d5331b5a4f1111dcbae3ef148eda1a
src/main/webapp/hxzk/mapshow/mapShow.jsp
@@ -141,6 +141,35 @@
                     /*padding: 10px 30px;*/
                     color: black;
                  }
                  .blue{
                     margin-top: 14px;
                     font-weight: bolder;
                     font-size: 14px;
                  }
                  .blue1,.blue2,.blue3,.blue4:active{
                     color: black;
                     border-radius: 5px;
                  }
                  .blue4{
                     color: black;
                     border-radius: 5px;
                  }
                  .blue1{
                     text-decoration: none;
                     color: black;
                     font-weight: bolder;
                  }
                  .container{
                     box-shadow: 1px 2px 5px #666666;
                     position: fixed;
                     top: 400px;
                     left: 1820px;
                     z-index: 99999999999;
                     opacity: 1;
                  }
               </style>
            </head>
@@ -193,53 +222,68 @@
                     <div class="row layout-top-spacing" id="cancel-row">
                        <div class="col-xl-12 col-lg-12 col-sm-12  layout-spacing">
                           <div class="widget widget-one_hybrid widget-engagement" id="map0"
                              style="width: 49.5%; float: left;" ondblclick="changemap0()">
                              <div class="widget-heading" style="height: 450px; width: 100%" id="maphead0">
                              style="width: 100%; float: left;" ondblclick="changemap0()">
                              <div class="widget-heading" style="height: 800px; width: 100%" id="maphead0">
                                 <div class='panel-head' id="mapname0">地图0</div>
                                 <div style="width: 100%; height: 400px; float: left" id="wrap0">
                                 <div style="width: 100%; height: 750px; float: left" id="wrap0">
                                    <canvas id="draw0"></canvas>
                                    <p style="z-index: 9999;" id="jiazai0">正在加载地图......</p>
                                 </div>
                              </div>
                           </div>
                           <div class="widget widget-one_hybrid widget-engagement"
                              style="margin-left: 1%; width: 49.5%; float: left;" id="map1"
                              style=" width: 100%; float: left;position: absolute;" id="map1"
                              ondblclick="changemap1()">
                              <div class="widget-heading" style="height: 450px; width: 100%" id="maphead1">
                              <div class="widget-heading" style="height: 800px; width: 100%" id="maphead1">
                                 <div class='panel-head' id="mapname1">地图1</div>
                                 <div style="width: 100%; height: 400px; float: left" id="wrap1">
                                 <div style="width: 100%; height: 750px; float: left" id="wrap1">
                                    <canvas id="draw1"></canvas>
                                    <p style="z-index: 9999;" id="jiazai1">正在加载地图......</p>
                                 </div>
                              </div>
                           </div>
                           <div class="widget widget-one_hybrid widget-engagement"
                              style="width: 49.5%; float: left; margin-top: 1%" id="map2"
                              style="width: 100%; float: left;position: absolute;" id="map2"
                              ondblclick="changemap2()">
                              <div class="widget-heading" style="height: 450px; width: 100%" id="maphead2">
                              <div class="widget-heading" style="height: 800px; width: 100%" id="maphead2">
                                 <div class='panel-head' id="mapname2">地图2</div>
                                 <div style="width: 100%; height: 400px; float: left" id="wrap2">
                                 <div style="width: 100%; height: 750px; float: left" id="wrap2">
                                    <canvas id="draw2"></canvas>
                                    <p style="z-index: 9999;" id="jiazai2">正在加载地图......</p>
                                 </div>
                              </div>
                           </div>
                           <div class="widget widget-one_hybrid widget-engagement"
                              style="width: 49.5%; margin-left: 1%; float: left; margin-top: 1%" id="map3"
                              style="width:100%; float: left;position: absolute;" id="map3"
                              ondblclick="changemap3()">
                              <div class="widget-heading" style="height: 450px; width: 100%" id="maphead3">
                                 <div class='panel-head' id="mapname3">地图4</div>
                                 <div style="width: 100%; height: 400px; float: left" id="wrap3">
                              <div class="widget-heading" style="height: 800px; width: 100%" id="maphead3">
                                 <div class='panel-head' id="mapname3">地图3</div>
                                 <div style="width: 100%; height: 750px; float: left" id="wrap3">
                                    <canvas id="draw3"></canvas>
                                    <p style="z-index: 9999;" id="jiazai3">正在加载地图......</p>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
               <div  id="boxfloor" style="width: 46px;height: 40px;position: absolute;top: 430px;left: 1810px;background-color: white;border-radius: 8px;opacity: 0.8;">
                  <a href="/hxzkoa/show.do" onclick="shouye()" id="shouye" style="text-decoration: none;color: black;font-weight: bolder;margin-top: 4px;display: inline-block"><img src="/hxzkoa/hxzk/image/icon/shouye.png" width="30"></a>
               </div>
               <!--  END CONTENT PART  -->
               <div style="background-color: white;width: 46px;height: 194px;border-radius: 10px;padding-top: 10px;padding-bottom: 10px;position: absolute;top: 500px;left: 1810px;opacity: 0.8;box-shadow: 2px 2px 3px black;z-index: 99999" id="boxfloor">
                  <a href="#" class="blue1"><div class="blue1" style="text-align: center;height: 30px;width: 30px;line-height: 30px;margin-top: 14px;margin: auto;"onclick="f1()">F1</div></a>
                  <div style="margin: auto;width: 30px;border-top: 1px solid #cccccc;margin-top: 7px;display: none" class="f2"></div>
                  <a href="#" class="blue1"><div class="blue2" style="text-align: center;height: 30px;width: 30px;line-height: 30px;margin-top: 14px;margin: auto;margin-top: 10px;display: none" id="f2" onclick="f2()">F2</div></a>
                  <div style="margin: auto;width: 30px;border-top: 1px solid #cccccc;margin-top: 7px;display: none" class="f3"></div>
                  <a href="#" class="blue1"><div class="blue3" style="text-align: center;height: 30px;width: 30px;line-height: 30px;margin-top: 14px;margin: auto;margin-top: 10px;display: none" id="f3" onclick="f3()">F3</div></a>
                  <div style="margin: auto;width: 30px;border-top: 1px solid #cccccc;margin-top: 7px;display: none" class="f4"></div>
                  <a href="#" class="blue1"><div class="blue4" style="text-align: center;height: 30px;width: 30px;line-height: 30px;margin-top: 14px;margin: auto;margin-top: 10px;display: none" id="f4" onclick="f4()">F4</div></a>
               </div>
               <!-- END MAIN CONTAINER -->
               <% String username=(String) session.getAttribute("username"); if (username==null ||
@@ -322,6 +366,62 @@
                  <script>
                     //选择楼层
                     function f1(){
                        document.getElementById("map0").style.display = "block";
                        document.getElementById("map1").style.display = "none";
                        document.getElementById("map2").style.display = "none";
                        document.getElementById("map3").style.display = "none";
                        $(".blue1").css("background-color","#1DECFE")
                        $(".blue2").css("background-color","white")
                        $(".blue3").css("background-color","white")
                        $(".blue4").css("background-color","white")
                     }
                     function f2(){
                        document.getElementById("map1").style.width = "100%";
                        document.getElementById("maphead1").style.height = "800px";
                        document.getElementById("wrap1").style.height = "750px";
                        document.getElementById("map0").style.display = "none";
                        document.getElementById("map1").style.display = "block";
                        document.getElementById("map2").style.display = "none";
                        document.getElementById("map3").style.display = "none";
                        $(".blue2").css("background-color","#1DECFE")
                        $(".blue3").css("background-color","white")
                        $(".blue4").css("background-color","white")
                        $(".blue1").css("background-color","white")
                     }
                     function f3(){
                        document.getElementById("map2").style.width = "100%";
                        document.getElementById("maphead2").style.height = "800px";
                        document.getElementById("wrap2").style.height = "750px";
                        document.getElementById("map0").style.display = "none";
                        document.getElementById("map1").style.display = "none";
                        document.getElementById("map2").style.display = "block";
                        document.getElementById("map3").style.display = "none";
                        $(".blue3").css("background-color","#1DECFE")
                        $(".blue4").css("background-color","white")
                        $(".blue2").css("background-color","white")
                        $(".blue1").css("background-color","white")
                     }
                     function f4(){
                        document.getElementById("map3").style.width = "100%";
                        document.getElementById("maphead3").style.height = "800px";
                        document.getElementById("wrap3").style.height = "750px";
                        document.getElementById("map0").style.display = "none";
                        document.getElementById("map1").style.display = "none";
                        document.getElementById("map2").style.display = "none";
                        document.getElementById("map3").style.display = "block";
                        $(".blue4").css("background-color","#1DECFE")
                        $(".blue3").css("background-color","white")
                        $(".blue2").css("background-color","white")
                        $(".blue1").css("background-color","white")
                     }
                     //首页地图控制
                     var full_screen = false;
                     var timer_list = [];
@@ -340,6 +440,7 @@
                                 document.getElementById("map1").style.display = "none";
                                 document.getElementById("map2").style.display = "none";
                                 document.getElementById("map3").style.display = "none";
                              } else if (data.length == 1) {
                                 tubiaochicun = 0.015;
                                 document.getElementById("map0").style.width = "100%";
@@ -350,10 +451,36 @@
                                 document.getElementById("map2").style.display = "none";
                                 document.getElementById("map3").style.display = "none";
                                 full_screen = true;
                              } else if (data.length == 2) {
                                 document.getElementById("map2").style.display = "none";
                                 document.getElementById("map3").style.display = "none";
                              };
                              }
                              if (data.length == 1) {
                                 $("#f1").css("display", "block")
                              }
                              if (data.length == 2) {
                                 $("#f2").css("display", "block")
                                 $(".f2").css("display", "block")
                                 $("#boxfloor").css("height","100px")
                              }
                              if (data.length == 3) {
                                 $("#f2").css("display", "block")
                                 $(".f2").css("display", "block")
                                 $("#f3").css("display", "block")
                                 $(".f3").css("display", "block")
                                 $("#boxfloor").css("height","150px")
                              }
                              if (data.length == 4) {
                                 $("#f2").css("display", "block")
                                 $(".f2").css("display", "block")
                                 $("#f3").css("display", "block")
                                 $(".f3").css("display", "block")
                                 $("#f4").css("display", "block")
                                 $(".f4").css("display", "block")
                              }
                              $(".floor1").css("display", "block")
                              // } else if (data.length == 2) {
                              //    $(".floor2").css("display","block")
                              //    // document.getElementById("map2").style.display = "none";
                              //    // document.getElementById("map3").style.display = "none";
                              // }
                              for (var i = 0; i < data.length; i++) {
                                 str = "mapname" + i;
                                 document.getElementById(str).innerHTML = data[i].mapname;