<!DOCTYPE html>
|
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
|
<html>
|
<head>
|
<!-- 标题及搜索关键字 -->
|
<link rel="shortcut icon" type="image/x-icon" href="/img/favicon/favicon.ico"/>
|
<title>首页</title>
|
<link rel="stylesheet" type="text/css" href="css/HomeMap.css">
|
<!--第三方lib-->
|
<script type="text/javascript" src="/hxzkuwb/Home/demo/lib/include-lib.js" libpath="/hxzkuwb/Home/demo/lib/" include="jquery,layer,toastr,font-awesome,bootstrap,layer,haoutil,mars3d,mars3d-space"></script>
|
<link href="/hxzkuwb/Home/demo/css/style.css" rel="stylesheet"/>
|
<style>
|
#GongJuLan {
|
overflow: hidden;
|
/* 隐藏滚动条 */
|
overflow-y: scroll;
|
/* 保持垂直滚动功能 */
|
-ms-overflow-style: none;
|
/* 隐藏 IE 和 Edge 的滚动条 */
|
scrollbar-width: none;
|
/* 隐藏 Firefox 的滚动条 */
|
}
|
|
#GongJuLan::-webkit-scrollbar {
|
display: none;
|
/* 隐藏 Chrome、Safari 和 Opera 的滚动条 */
|
}
|
|
#acd {
|
display: none;
|
position: fixed;
|
top: 20%;
|
/* 设置距离页面顶部的距离 */
|
width: 32%;
|
/* 设置宽度为页面宽度的40% */
|
height: auto;
|
/* 可根据内容自适应高度 */
|
margin: auto;
|
left: 34%;
|
/* 设置左边距为页面宽度的30% */
|
right: 34%;
|
/* 设置右边距为页面宽度的30% */
|
z-index: 9999;
|
/* 设置层级 */
|
background: url("icon/border.png") no-repeat;
|
background-size: 100% 100%;
|
border-radius: 20px;
|
}
|
|
h1 {
|
font-size: 14px;
|
}
|
|
#title {
|
z-index: 99;
|
}
|
|
input::placeholder {
|
color: white;
|
}
|
#ChaXuns{
|
position: fixed;
|
top: 22px;
|
z-index: 9999999;
|
text-align: center;
|
width: 20%;
|
left: 66%;
|
}
|
</style>
|
</head>
|
<body class="" style="">
|
<div id="ChaXuns" style="">
|
<div>
|
<span>
|
<input id="KuaiSuDingWeiTag" type="text" placeholder="" style="background-color: rgb(255, 255, 255,0.5);padding-left: 5px;border: none;width: 100px;color: black;height: 30px;border-top-left-radius: 4px;border-bottom-left-radius: 4px"/>
|
</span>
|
<a href="javascript:;" onclick="KuaiSuDingWei()" id="SouSuoTag"><span style="position: relative;top: -5px;left: -4px;width: 40px;height: 30px;border-bottom-right-radius: 4px;border-top-right-radius: 4px;background-color: rgb(116, 143, 252,0.5);display: inline-block">
|
<img src="HomeImg/search.png" width="20" height="20" style="position: relative;top: 3px"/>
|
</span>
|
</a>
|
</div>
|
</div>
|
<div id="GongJuLan" class="YeJian" style="width: 20%;background-color: rgb(0,0,0,0.5);position: fixed;right: -20%;bottom: 4%;top: 6%;z-index: 999;height: 90%;border-radius: 10px;border: 1px solid #666666">
|
<div class="GongJuLanZi" style="height: 4%;width: 100%;border-top-left-radius: 10px;border-top-right-radius: 10px;background-color: black;border-bottom: 1px solid #666666">
|
<h1 style="text-align: center;line-height: 4vh;">
|
<img src="icon/GongJu.png" width="20" style="position: relative;top: -0.2vh"/>
|
<span>工具栏</span>
|
</h1>
|
</div>
|
<div style="overflow: hidden;width: 100%;border-bottom: 1px solid #666666">
|
<h1 style="line-height: 4vh;height: 4%;border-bottom: 1px dashed #666666">
|
<img src="icon/ShiTu.png" width="20" style="position: relative;top: -0.2vh;margin-left: 4%"/>
|
<span>视图</span>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">二维视图</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="to2d" onchange="to2d()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">三维视图</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="to3d" onchange="to3d()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">2.5D视图</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="toGLB" onchange="toGLB()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">双屏对比</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="ShuangPing" onchange="createControl()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">卷帘对比</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="JuanLian" onchange="createControlJuan()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
</div>
|
<div style="overflow: hidden;width: 100%;border-bottom: 1px solid #666">
|
<h1 style="line-height: 4vh;height: 4%;border-bottom: 1px dashed #666666">
|
<img src="icon/JiChu.png" width="20" style="position: relative;top: -0.2vh;margin-left: 4%"/>
|
<span>基础功能</span>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">全屏</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showFullScreen">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">视角复位</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showGoHome">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">城市搜索</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showLocationSearch">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">地图缩放</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="zoomButton">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">位置信息</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showLocation">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">时钟</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showClock">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">时间线</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showTimeLine">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">比例尺</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showLegend">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">导航球</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showNav">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">夜间模式</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="AnHeiMoShi">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">操作指南</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="showHelpButton">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
</div>
|
</div>
|
<div id="XinXiZhanShi" class="YeJian" style="width: 20%;background-color: rgb(0,0,0,0.5);position: fixed;top: 6%;z-index: 999;height: 90%;border-radius: 10px;border: 1px solid #666666;left: -20%">
|
<div class="GongJuLanZi" style="height: 4%;width: 100%;border-top-left-radius: 10px;border-top-right-radius: 10px;background-color: black;border-bottom: 1px solid #666666">
|
<h1 style="text-align: center;line-height: 4vh;">
|
<img src="icon/ZhanShiTu.png" width="20" style="position: relative;top: -0.2vh"/>
|
<span>数据展示</span>
|
</h1>
|
</div>
|
<div style="overflow: hidden;width: 100%;border-bottom: 1px solid #666666">
|
<h1 style="line-height: 4vh;height: 4%;border-bottom: 1px dashed #666666">
|
<img src="icon/ZhanShi.png" width="20" style="position: relative;top: -0.2vh;margin-left: 4%"/>
|
<span>功能视图</span>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">告警信息</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="ToGaoJing" onchange="ToGaoJing()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">今日统计</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="ToTongJi" onchange="ToTongJi()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">即使通讯</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="ToTongXun" onchange="ToTongXun()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">区域统计</span>
|
<label class="switch" style="float: right;margin-right: 4%">
|
<input type="checkbox" id="ToQuYu" onchange="ToQuYu()">
|
<div class="slider">
|
<div class="circle">
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="6" height="6" x="0" y="0" viewBox="0 0 365.696 365.696" style="enable-background:new 0 0 512 512" xml:space="preserve" class="cross">
|
<g>
|
<path d="M243.188 182.86 356.32 69.726c12.5-12.5 12.5-32.766 0-45.247L341.238 9.398c-12.504-12.503-32.77-12.503-45.25 0L182.86 122.528 69.727 9.374c-12.5-12.5-32.766-12.5-45.247 0L9.375 24.457c-12.5 12.504-12.5 32.77 0 45.25l113.152 113.152L9.398 295.99c-12.503 12.503-12.503 32.769 0 45.25L24.48 356.32c12.5 12.5 32.766 12.5 45.247 0l113.132-113.132L295.99 356.32c12.503 12.5 32.769 12.5 45.25 0l15.081-15.082c12.5-12.504 12.5-32.77 0-45.25zm0 0" fill="currentColor" data-original="#000000"></path>
|
</g>
|
</svg>
|
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="10" height="10" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="checkmark">
|
<g>
|
<path d="M9.707 19.121a.997.997 0 0 1-1.414 0l-5.646-5.647a1.5 1.5 0 0 1 0-2.121l.707-.707a1.5 1.5 0 0 1 2.121 0L9 14.171l9.525-9.525a1.5 1.5 0 0 1 2.121 0l.707.707a1.5 1.5 0 0 1 0 2.121z" fill="currentColor" data-original="#000000" class=""></path>
|
</g>
|
</svg>
|
</div>
|
</div>
|
</label>
|
</h1>
|
<h1 style="width: 100%;display: inline-block">
|
<span style="margin-left: 4%;float: left;position: relative;top: 0.5vh">快速定位</span>
|
<button onclick="KuaiSuDingWei()" style="float: right;position: relative;border: none;background-color:rgb(1,1,1,0.5);font-size: 12px;padding: 2% 2%;color: white;border: 1px solid #666;border-radius: 5px;margin-right: 4%" class="whites">定位</button>
|
<input id="KuaiSuDingWeiTag" size="12" style="color: white;float: right;margin-right: 2%;background-color: rgb(1,1,1,0.5);border: 1px solid #666;padding: 2%;font-size: 12px;border-radius: 5px" type="text" placeholder="请输入编号\姓名" class="whites">
|
</h1>
|
</div>
|
</div>
|
<div id="mars3dContainer" class="mars3d-container" style="width: 100%;height: 103%;"></div>
|
<div class="layui-row" id="acd" style="cursor:pointer;z-index: 999;">
|
<div class="layui-col-xs12 layui-col-md12" style="">
|
<div class="boxalls" style="border:none;padding: 5%">
|
<div class="" style="color: white;width: 100%;height:40%;">
|
<div style="width: 100%;">
|
<a href="javascript:;" onclick="ShuaXinShuJu()">
|
<span style="width: 100px;display: inline-block;background-color: black;text-align: center;color: white;height: 25px;line-height: 25px;" id="refer">刷新</span>
|
<span style="color: black;margin-left: 30px" id="personDate"></span>
|
</a>
|
<a href="javascript:;" onclick="GuanMsg()">
|
<span style="width: 60px;display: inline-block;background-color: black;text-align: center;color: white;height: 25px;line-height: 25px;float: right;margin-right: 5%" id="close">关闭</span>
|
</a>
|
</div>
|
<div style="margin-top: 10px;float: left;width: 22%;">
|
<a href="javascript:;">
|
<span style="display: inline-block;width: 100px;height: 200px;" id="personImage"></span>
|
</a>
|
</div>
|
<div style="margin-top: 2%;float: left;display: inline-block;width: 70%;">
|
<span style="font-size: 12px;display:inline-block;width: 30%;" id="ThatPerson1">
|
姓名：<span class="xingming"></span>
|
</span>
|
<span style="font-size: 12px;display: inline-block;width: 30%;" id="ThatPerson2">
|
性别：<span class="xingbie"></span>
|
</span>
|
<span style="font-size: 12px;display: inline-block;width: 30%;" id="ThatPerson3">
|
部门：<span class="bumen"></span>
|
</span>
|
</div>
|
<div style="margin-top: 5%;float: left;width: 70%">
|
<span style="font-size: 12px;display:inline-block;width: 30%;" id="ThatPerson4">
|
版本：<span class="banben"></span>
|
</span>
|
<span style="font-size: 12px;display:inline-block;width: 30%;" id="ThatPerson5">
|
类型：<span class="leixing"></span>
|
</span>
|
<span style="font-size: 12px;display:inline-block;width: 30%;" id="ThatPerson6">
|
电话：<span class="dianhua"></span>
|
</span>
|
</div>
|
<div style="margin-top: 5%;float: left;;width: 70%">
|
<span style="font-size: 12px;display:inline-block;width: 30%;" id="ThatPerson7">
|
卡号：<span class="kahao"></span>
|
</span>
|
<span style="font-size: 12px;display:inline-block;width: 30%;" id="ThatPerson8">
|
岗位：<span class="shijian"></span>
|
</span>
|
<span style="font-size: 12px;display:inline-block;width: 30%;" id="ThatPerson9">
|
电量：<span class="powers"></span>
|
</span>
|
</div>
|
<div style="margin-top: 30px;float: left;margin-left: 10px;width: 500px;">
|
<span style="margin: 20px;position: relative;left: -5px;top: -120px;" id="ThatPerson10">用户照片</span>
|
</div>
|
<div style="margin-top: 10%;float: left;position: relative;top: -110px;width: 100%;">
|
<span style="font-size: 12px;width: 26%;display: inline-block;" id="ThatPerson11">
|
经度：<span class="jingdu"></span>
|
</span>
|
<span style="font-size: 12px;width: 26%;display: inline-block;" id="ThatPerson12">
|
纬度：<span class="weidu"></span>
|
</span>
|
<span style="font-size: 12px;width: 20%;display: inline-block;" id="ThatPerson13">
|
高程：<span class="gaocheng"></span>
|
</span>
|
<span style="font-size: 12px;width: 20%;display: inline-block;" id="ThatPerson14">
|
状态：<span class="zhuangtai1"></span>
|
</span>
|
</div>
|
<div style="margin-top: 10px;float: left;position: relative;top: -110px;width: 100%;">
|
<span style="font-size: 12px;width: 26%;display: inline-block;" id="ThatPerson15">
|
X坐标：<span class="xzuobiao"></span>
|
</span>
|
<span style="font-size: 12px;width: 26%;display: inline-block;" id="ThatPerson16">
|
Y坐标：<span class="yzuobiao"></span>
|
</span>
|
<span style="font-size: 12px;width: 20%;display: inline-block;" id="ThatPerson17">
|
楼层：<span class="louceng"></span>
|
</span>
|
<span style="font-size: 12px;width: 20%;display: inline-block;" id="ThatPerson18">
|
状态：<span class="zhuangtai2"></span>
|
</span>
|
</div>
|
<div style="margin-top: 30px;float: left;position: relative;top: -110px;width: 100%;">
|
<span id="ThatPerson19">文字：</span>
|
<span>
|
<input type="text" id="context1" style="width: 70%;height: 25px;border: 1px solid black;background-color: rgb(0,0,0,0.5)">
|
</span>
|
<a href="javascript:;" onclick="sendMsg()">
|
<span style="border: 1px solid black;line-height: 24px;background-color:black;display: inline-block;text-align: center;position: relative;left: -5px;top: 0px;padding: 0% 0.4%" id="send">发送</span>
|
</a>
|
</div>
|
</div>
|
</div>
|
<div class="boxfoot6"></div>
|
</div>
|
</div>
|
</body>
|
|
<script>
|
var map
|
// mars3d.Map三维地图对象
|
var graphicLayer
|
// 矢量图层对象
|
var graphicLayerFence
|
// 矢量图层对象
|
var mapSplit
|
//双屏对比
|
var mapSplit1
|
var NameTitle
|
//双屏对比
|
var mapOptions = {
|
scene: {
|
center:{ lat: 34.36256821749659, lng: 108.77323150634766, alt: 40, heading: 0, pitch: -90 }
|
},
|
control: {
|
geocoder: {
|
service: "gaode",
|
insertIndex: 0
|
},
|
homeButton: true, // 视角复位按钮
|
// sceneModePicker: false,
|
//平铺：3D
|
}
|
|
}
|
|
function onMounted(mapInstance) {
|
map = mapInstance
|
// 记录map
|
//showQxShequDemo()
|
//map.basemap = 2023;
|
var currentTime = new Date();
|
var newTime = new Date(currentTime.getTime() - 5000);
|
map.clock.currentTime = Cesium.JulianDate.fromDate(new Date(newTime))
|
showCarList()
|
//加载人员数据
|
graphicLayerFence = new mars3d.layer.GraphicLayer()
|
map.addLayer(graphicLayerFence)
|
addfence()
|
//加载围栏数据
|
ChuShiGongJuLan()
|
//初始化工具栏
|
// map.hasTerrain =false
|
LayerAdd();
|
}
|
|
function onUnmounted() {
|
map = null
|
}
|
|
function showCarList() {
|
// 创建矢量数据图层
|
graphicLayer = new mars3d.layer.GraphicLayer()
|
map.addLayer(graphicLayer)
|
|
// 鼠标移入提示信息
|
graphicLayer.bindPopup(function(event) {
|
|
var attr = event.graphic?.attr;
|
if (NameTitle == 1) {
|
return ''+attr.id+'<br>'+attr.name
|
}
|
|
return ' '+attr.id
|
}, {
|
autoClose: false,
|
// 设置为 true 或 false，根据需求
|
closeButton: false,
|
closeOnClick: false,
|
distanceDisplayCondition: false,
|
pointerEvents: false,
|
offset: { // 设置偏移量以固定在模型头上
|
x: 0,
|
y: 50
|
}
|
|
})
|
// 单击地图空白处
|
map.on(mars3d.EventType.clickMap, function(event) {
|
if (lastClickCar) {
|
lastClickCar.circle.show = false
|
// lastClickCar = null
|
}
|
GongJuLanHide()
|
XinXiZhanShiHide()
|
})
|
// 绑定点击事件
|
graphicLayer.on(mars3d.EventType.click, (event, position) => {
|
var car = event.graphic
|
//personMsgtid(car.attr.id)
|
if (lastClickCar) {
|
if (lastClickCar === car) {
|
return
|
}
|
// 重复单击，跳出
|
lastClickCar.circle.show = false
|
lastClickCar = null
|
}
|
car.circle.show = true
|
lastClickCar = car
|
car.openPopup();
|
}
|
)
|
var lastClickCar
|
|
let PersonsList = [];
|
|
// 定义一个存储已添加模型的ID集合
|
let addedCarIds = new Set();
|
|
// 定义一个获取人员列表的函数
|
function fetchPersonsList() {
|
$.ajax({
|
async: false,
|
type: 'GET',
|
traditional: true,
|
url: "/hxzkuwb/getGPSCesium",
|
dataType: 'json',
|
data: {},
|
success: function(data) {
|
PersonsList = data;
|
// 记录当前在线人员的ID
|
const currentOnlineIds = new Set();
|
const currentNoOnlineIds = new Set();
|
// 遍历人员列表
|
PersonsList.forEach(item => {
|
item.show = true;
|
item.type = 1;
|
// 仅处理在线人员
|
if (item.online === "1") {
|
// 使用 '===' 比较
|
currentOnlineIds.add(item.id);
|
|
// 检查是否已添加过模型
|
if (!addedCarIds.has(item.id)) {
|
let modelParam = {
|
scale: 15,
|
url: "//data.mars3d.cn/gltf/mars/man/walk.gltf",
|
pitch: 0,
|
roll: 0,
|
};
|
let car = new mars3d.graphic.Route({
|
id: item.id,
|
name: item.name,
|
maxCacheCount: -1,
|
model: {
|
...modelParam,
|
clampToGround: true,
|
},
|
circle: {
|
radius: 10,
|
materialType: mars3d.MaterialType.CircleWave,
|
materialOptions: {
|
color: "red",
|
opacity: 0.3,
|
speed: 10,
|
count: 3,
|
gradient: 0.1
|
},
|
clampToGround: true,
|
show: false
|
},
|
attr: item,
|
});
|
|
// 将模型添加到图层中
|
graphicLayer.addGraphic(car);
|
|
// 打开模型弹窗
|
car.openPopup();
|
|
// 将已添加模型的ID记录到集合中
|
addedCarIds.add(item.id);
|
}
|
} else {
|
currentNoOnlineIds.add(item.id);
|
|
// 移除不在线人员的模型
|
if (addedCarIds.has(item.id)) {
|
// 通过 ID 查找对应的图形并移除
|
graphicLayer.getGraphics().forEach(graphic => {
|
if (graphic.id === item.id) {
|
graphicLayer.removeGraphic(graphic);
|
currentNoOnlineIds.delete(item.id);
|
}
|
}
|
);
|
addedCarIds.delete(item.id);
|
// 移除 ID 记录
|
}
|
}
|
});
|
NameTitle =1;
|
}
|
});
|
}
|
|
// 定义一个更新轨迹的函数
|
function updateTrajectories() {
|
$.ajax({
|
async: false,
|
type: 'GET',
|
traditional: true,
|
url: "/hxzkuwb/getGPS",
|
dataType: 'json',
|
data: {},
|
success: function(data) {
|
var listALL = data;
|
|
graphicLayer.eachGraphic( (car) => {
|
|
// 取出对应车辆的轨迹列表
|
var path = listALL.filter( (item) => item.ptagid === car.id);
|
path.forEach( (item) => {
|
var point = new mars3d.LngLatPoint(item.baoliu2,item.baoliu3,item.baoliu4);
|
car.addDynamicPosition(point, item.paddtiem);
|
}
|
);
|
}
|
);
|
}
|
});
|
}
|
// 每五秒获取一次人员列表
|
setInterval(fetchPersonsList, 10000);
|
// 每两秒更新一次轨迹
|
setInterval(updateTrajectories, 5000);
|
// 页面加载时立即获取一次人员列表
|
fetchPersonsList();
|
}
|
function addfence() {
|
var fences = [];
|
var fencesName = [];
|
$.ajax({
|
url: "/hxzkuwb/baidufenceName.do",
|
type: "GET",
|
async: false,
|
// 设置为 false 以使请求同步
|
success: function(data) {
|
fencesName = data;
|
},
|
error: function(xhr, status, error) {
|
console.error("请求失败: ", status, error);
|
}
|
});
|
$.ajax({
|
async: false,
|
//同步的
|
type: "GET",
|
url: "/hxzkuwb/baidufence.do",
|
dataType: "json",
|
success: function(data) {
|
fences = data.fences;
|
for (let i = 0; i < fences.length; i++) {
|
let fencesList = fences[i].split(';')
|
let fence = [];
|
for (let j = 0; j < fencesList.length; j++) {
|
const coordinateString = fencesList[j];
|
const [longitude,latitude] = coordinateString.split(',');
|
fence.push([parseFloat(longitude), parseFloat(latitude)]);
|
}
|
let colorFence = ""
|
let JuXingcolorFence = ""
|
if (fencesName[i].color == "红色"){
|
colorFence = "#C70708"
|
JuXingcolorFence="rgba(227,60,47,0.5)"
|
}
|
if (fencesName[i].color == "蓝色"){
|
colorFence = "#0D3DC1"
|
JuXingcolorFence="rgba(13,130,125,0.5)"
|
|
}
|
if (fencesName[i].color == "绿色"){
|
colorFence = "#20D85C"
|
JuXingcolorFence="rgba(54,150,80,0.5)"
|
}
|
if (fencesName[i].color == "黑色"){
|
colorFence = "#1E1E1E"
|
JuXingcolorFence="rgba(0,0,0,0.5)"
|
}
|
if (fencesName[i].color == "白色"){
|
colorFence = "#FFFFFF"
|
JuXingcolorFence="rgba(255,255,255,0.5)"
|
}
|
|
if(fencesName[i].shape =="多边形"){
|
const graphic = new mars3d.graphic.WallPrimitive({
|
positions: fence,
|
style: {
|
closure: true,
|
diffHeight: fencesName[i].baoliu11/100,
|
materialType: mars3d.MaterialType.LineFlow,
|
materialOptions: {
|
// 动画线材质
|
image: "img/textures/fence.png",
|
axisY: true,
|
color: colorFence,
|
speed: 10 // 速度，建议取值范围1-100
|
},
|
label: {
|
text: fencesName[i].name,
|
font_size: 18,
|
outline: true,
|
outlineColor: colorFence,
|
color: "#ffffff",
|
distanceDisplayCondition: true,
|
distanceDisplayCondition_far: 500000,
|
distanceDisplayCondition_near: 0
|
}
|
},
|
|
})
|
graphicLayerFence.addGraphic(graphic)
|
}else{
|
var graphic = new mars3d.graphic.RectanglePrimitive({
|
positions: [
|
fence[0],
|
fence[1]
|
],
|
style: {
|
color: JuXingcolorFence,
|
diffHeight: fencesName[i].baoliu11/100,
|
label: {
|
text: fencesName[i].name,
|
font_size: 18,
|
color: "#FFFFFF",
|
distanceDisplayCondition: true,
|
distanceDisplayCondition_far: 500000,
|
distanceDisplayCondition_near: 0
|
}
|
},
|
|
})
|
graphicLayerFence.addGraphic(graphic) // 还可以另外一种写法: graphic.addTo(graphicLayer)
|
}
|
}
|
|
},
|
});
|
return fences;
|
}
|
function LayerAdd(){
|
var tileLayer = new mars3d.layer.XyzLayer({
|
url: "/hxzkuwb/Home/demo/titles/{z}/{x}/{y}.png",
|
minimumLevel: 0,
|
maximumLevel: 18,
|
})
|
map.addLayer(tileLayer)
|
}
|
function ImgAdd(){
|
var tileLayer = new mars3d.layer.ImageLayer({
|
name: "1234",
|
url: "/hxzkuwb/Home/demo/img/map1.png",
|
rectangle: { xmin: 107.037555, xmax: 107.042794, ymin: 29.777635, ymax: 29.776744 },
|
zIndex: 20
|
})
|
map.addLayer(tileLayer)
|
}
|
</script>
|
</html>
|
