<!DOCTYPE html>
|
<html lang="en">
|
|
<head>
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
<meta name="viewport"
|
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
|
<title>缓冲区分析</title>
|
<link href="../SmartEarthSDK/Workers/layui/css/layui.css" rel="stylesheet" />
|
<style>
|
.bnt-box {
|
width: 90%;
|
margin: auto;
|
height: 58px;
|
border-bottom: 1px #999 solid;
|
text-align: center;
|
}
|
|
.bnt-box button {
|
margin-top: 10px;
|
width: 80px;
|
}
|
|
.iptline {
|
position: absolute;
|
top: 9px;
|
right: -50px;
|
font-weight: bold;
|
}
|
|
.layui-input {
|
background-color: #fff !important;
|
}
|
|
.layui-form-label {
|
font-weight: bold !important;
|
font-size: 15px;
|
}
|
.layui-btn{
|
background-color: rgba(0, 168, 255, 0.16) !important;
|
}
|
</style>
|
</head>
|
|
<body>
|
<div class="bnt-box">
|
<button type="button" id="DrawPoint" class="layui-btn layui-btn-normal">点</button>
|
<button type="button" id="DrawPolyline" class="layui-btn layui-btn-normal">线</button>
|
<button type="button" id="DrawPolygon" class="layui-btn layui-btn-normal">面</button>
|
<!-- <button type="button" id="clearBuff" class="layui-btn layui-btn-danger removeGraphic">
|
<i class="layui-icon"></i>
|
</button> -->
|
</div>
|
<div class="layui-form-item" style="width: 240px; margin-top: 12px;margin-left: 10px;">
|
<label class="layui-form-label" style="font-weight: bold;color: white;">缓冲半径</label>
|
<div class="layui-input-inline">
|
<input id="area" value="100" type="number" lay-verify="pass" placeholder="请输入缓冲区" autocomplete="off"
|
class="layui-input" onkeyup="value=value.replace(/[^\d\.]/g,'')">
|
<span class="iptline" style="color: white;">(米)</span>
|
</div>
|
</div>
|
<script src="../jquery-2.0.3.js"></script>
|
<script>
|
$('#area').on('input propertychange', function (event) {
|
let num;
|
if ($(this).val() == '') {
|
num = 0.0;
|
} else {
|
num = parseFloat($(this).val().replace(/[^\d\.]/g, ''));
|
}
|
parent.setBuff(num);
|
});
|
|
//画点
|
$('#DrawPoint').off('click').on('click', function () {
|
parent.DrawPointBuffer();
|
});
|
|
//画线
|
$('#DrawPolyline').off('click').on('click', function () {
|
parent.DrawPolylineBuffer();
|
});
|
|
//画面
|
$('#DrawPolygon').off('click').on('click', function () {
|
parent.DrawPolygonBuffer();
|
});
|
|
//清除
|
$('#clearBuff').off('click').on('click', function () {
|
parent.clearBuff();
|
});
|
</script>
|
</body>
|
|
</html>
|