jyyhq/witDisplay/page/eMap/eMap.html

120 lines
4.0 KiB
HTML
Raw Normal View History

2025-02-10 12:18:11 +08:00
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="../../css/core/layui.css" />
<link rel="stylesheet" type="text/css" href="../../css/eMap/eMap.css" />
<style>
.layui-layer {
background-color: rgba(0,0,0,0)!important;
background-image: url(../../img/bgSecondLevel.png);
background-repeat: no-repeat;
background-size: 100% 100%;
}
.layui-layer-title {
border-bottom: 0px solid #f0f0f0!important;
}
.hidden {
display: none;
}
.your-selector {
transform: perspective(500px) rotateX(30deg) rotateY(60deg) rotateZ(90deg);
}
</style>
</head>
<body>
<!-- <div class="interfaceState">-->
<!-- <div class="title" onclick="interfaceStateClick()">-->
<!-- -->
<!-- </div>-->
<!-- <div class="request">-->
<!-- <span>请求数量&nbsp;&nbsp;</span>-->
<!-- <span class="requestNum" id="requestNum" style="color: #30F7FF;"></span>-->
<!-- </div>-->
<!-- <div class="success">-->
<!-- <span>成功&nbsp;&nbsp;</span>-->
<!-- <span class="successNum" id="successNum" style="color: #93FFB6;"></span>-->
<!-- </div>-->
<!-- <div class="error">-->
<!-- <span>异常&nbsp;&nbsp;</span>-->
<!-- <span class="errorNum" id="errorNum" style="color: #FF2020;"></span>-->
<!-- </div>-->
<!-- </div>-->
<div id="map"></div>
<div style="display: flex; flex-direction: column">
<ul id="checkBox">
<li>
<span><input type="checkbox" checked id="checkbox1"/></span>
<label for="checkbox1">
<span><img src="../../img/eMap/01.png" alt=""/></span>
<span class="sizeColor">摄像设备</span>
<span class="sizeColor" >(<span id="camera"></span>)</span>
</label>
</li>
<li style="margin-top: 4%">
<span><input type="checkbox" checked id="checkbox2"/></span>
<label for="checkbox2">
<span><img src="../../img/eMap/02.png" alt=""/></span>
<span class="sizeColor">消防设备</span>
<span class="sizeColor" >(<span id="firefight"></span>)</span>
</label>
</li>
<li style="margin-top: 4%">
<span><input type="checkbox" checked id="checkbox3"/></span>
<label for="checkbox3">
<span><img src="../../img/eMap/03.png" alt=""/></span>
<span class="sizeColor">智能开关</span>
<span class="sizeColor" >(<span id="switch"></span>)</span>
</label>
</li>
<li style="margin-top: 4%">
<span><input type="checkbox" checked id="checkbox4"/></span>
<label for="checkbox4">
<span><img src="../../img/eMap/04.png" alt=""/></span>
<span class="sizeColor">安全防区</span>
<span class="sizeColor">(<span id="stand"></span>)</span>
</label>
</li>
<!-- <li style="margin-top: 4%">-->
<!-- <span><input type="checkbox" checked id="checkbox5"/></span>-->
<!-- <label for="checkbox5">-->
<!-- <span><img src="../../img/eMap/05.png" alt=""/></span>-->
<!-- <span class="sizeColor">道闸闸机</span>-->
<!-- <span class="sizeColor">4</span>-->
<!-- </label>-->
<!-- </li>-->
</ul>
<ul id="floors">
<li name='综合楼'>
<span><img src="../../img/eMap/floor.png" alt=""/></span>&nbsp;
<span class="sizeColor">1号楼</span>
</li>
<li name='化学楼'>
<span><img src="../../img/eMap/floor.png" alt=""/></span>&nbsp;
<span class="sizeColor">2号楼</span>
</li>
<li name='计量楼'>
<span><img src="../../img/eMap/floor.png" alt=""/></span>&nbsp;
<span class="sizeColor">3号楼</span>
</li>
<li name='4号楼'>
<span><img src="../../img/eMap/floor.png" alt=""/></span>&nbsp;
<span class="sizeColor">4号楼</span>
</li>
</ul>
</div>
<script src="../../js/core/jquery-3.6.0.js"></script>
<script src="../../js/core/layui2.7.6/layui.js"></script> <!--2.7.6-->
<script src="../../js/core/public.js" type="text/javascript"></script>
<script src="../../js/core/echarts.js"></script>
<script src="../../js/eMap/eMap.js"></script>
</body>
</html>