| | |
| | | /*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> |
| | | |
| | |
| | | <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 || |
| | |
| | | |
| | | |
| | | <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 = []; |
| | |
| | | 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%"; |
| | |
| | | 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; |