<!DOCTYPE html>
|
<html>
|
|
<head>
|
<meta charset="UTF-8">
|
<title>通视控制</title>
|
<link href="../../libs/layui/css/layui.css" rel="stylesheet">
|
<script type="text/javascript" src="../../libs/jquery/jquery-3.5.1.min.js"></script>
|
<script type="text/javascript" src="../../libs/layui/layui.js"></script>
|
<style>
|
.visiblediv {
|
color: white;
|
overflow-x: hidden;
|
overflow-y: auto;
|
padding: 0;
|
}
|
|
.mt-label {
|
height: 30px;
|
color: white;
|
width: 80px;
|
float: left;
|
margin-left: 10px;
|
line-height: 30px;
|
font-size: 12px;
|
}
|
|
.mt-content {
|
height: 30px;
|
color: white;
|
width: 200px;
|
float: left;
|
margin-left: 10px;
|
}
|
|
.mt-row {
|
height: 30px;
|
margin-left: 10px;
|
margin-top: 15px;
|
}
|
|
.mt-tip {
|
margin-left: 10px;
|
margin-top: 15px;
|
}
|
|
.form-control {
|
/* display: block; */
|
width: 150px;
|
height: 20px;
|
padding: 4px 12px;
|
font-size: 14px;
|
line-height: 1.6;
|
background-color: #2c3238;
|
opacity: 0.8;
|
color: #fff;
|
background-image: none;
|
border: 0px solid #e4eaec;
|
border-radius: 3px;
|
-webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
|
box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
|
-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
|
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
|
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
|
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
|
}
|
|
.mybtn-blue {
|
color: #fff;
|
background-color: #1E9FFF;
|
border-color: #1E9FFF;
|
}
|
.mybtn-yellow {
|
color: #fff;
|
background-color: #FFB800;
|
border-color: #FFB800;
|
}
|
|
.mybtn-green {
|
color: #fff;
|
background-color: #009688;
|
border-color: #009688;
|
}
|
.mybtn-red {
|
color: #fff;
|
background-color: #FF5722;
|
border-color: #FF5722;
|
}
|
</style>
|
</head>
|
|
<body>
|
<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
|
<!--[if lt IE 9]>
|
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
|
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
|
<![endif]-->
|
<form class="visiblediv">
|
<div class="mt-row">
|
<label class="mt-label">人员身高(厘米)</label>
|
<div class="mt-content">
|
<input type="number" id="bodyheight" autocomplete="off" class="form-control " value="175" max="245"
|
min="100">
|
</div>
|
</div>
|
<div class="mt-row">
|
<button style="margin-left: 10px;" type="button" class="layui-btn mybtn-blue layui-btn-sm" onclick="visibleLine()">
|
<i class="layui-icon layui-icon-about" style="font-size: 15px; color: white;"></i>
|
单线通视</button>
|
<button type="button" class="layui-btn mybtn-red layui-btn-sm" onclick="visibleCircle()">
|
<i class="layui-icon layui-icon-circle" style="font-size: 15px; color: white;"></i>
|
环装通视</button>
|
<button type="button" class="layui-btn mybtn-yellow layui-btn-sm" onclick="clearVisible()">
|
<i class="layui-icon layui-icon-delete" style="font-size: 15px; color: white;"></i>清除</button>
|
<!-- <button type="button" class="layui-btn" onclick="drawPolygon()">绘制面</button> -->
|
</div>
|
<!-- <div class="mt-row">
|
<button type="button" class="layui-btn mybtn layui-btn-sm" onclick="terrainEx()">地形夸张</button>
|
</div> -->
|
<div class="mt-tip">初次单击左键确定起点，再次单击左键确定终点。</div>
|
</form>
|
<script>
|
function visibleLine() {
|
var bodyheight = parseFloat(document.getElementById('bodyheight').value) / 100.0;
|
parent.showVisibleLine(bodyheight);
|
};
|
function visibleCircle() {
|
var bodyheight = parseFloat(document.getElementById('bodyheight').value) / 100.0;
|
parent.showVisibleCircle(bodyheight);
|
}
|
function terrainEx() {
|
parent.terrainEx();
|
};
|
function clearVisible() {
|
parent.clearVisible();
|
};
|
</script>
|
</body>
|
|
</html>
|
