<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
|
<%Session.CodePage=65001%>
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
<html>
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no">
|
<meta name="keywords" content="">
|
<meta name="description" content="">
|
<meta name="author" content="">
|
<link rel="icon" href="assets/images/favicon.png" type="image/png">
|
<title>根据关键字搜索地址</title>
|
<link href="assets/css/icons.css" rel="stylesheet">
|
<link href="assets/css/bootstrap.min.css" rel="stylesheet">
|
<link href="assets/css/style.css" rel="stylesheet">
|
<link href="assets/css/responsive.css" rel="stylesheet">
|
<link href="assets/plugins/bootstrap-datepicker/css/bootstrap-datepicker.min.css" rel="stylesheet">
|
<link href="assets/plugins/timepicker/bootstrap-timepicker.min.css" rel="stylesheet">
|
<style type="text/css">
|
#allmap {width: 100%;height: 200px;overflow: hidden;margin:0;}
|
body,
|
html,
|
#container {
|
overflow: hidden;
|
width: 100%;
|
height: 100%;
|
margin: 0;
|
font-family: "微软雅黑";
|
}
|
.info {
|
z-index: 999;
|
width: auto;
|
min-width: 22rem;
|
padding: .75rem 1.25rem;
|
margin-left: 1.25rem;
|
position: fixed;
|
top: 1rem;
|
background-color: #fff;
|
border-radius: .25rem;
|
font-size: 14px;
|
color: #666;
|
box-shadow: 0 2px 6px 0 rgba(27, 142, 236, 0.5);
|
}
|
</style>
|
<!--从百度地图开放平台获取API-->
|
<script src="assets/js/jquery.min.js"></script>
|
<script type="text/javascript" src="https://api.map.baidu.com/api?type=webgl&v=2.0&ak=vZk06XkStGGYT4ZGreQb0a6TsOLym4hR"></script>
|
<script>
|
// 创建地图函数
|
function createMap() {
|
//var map = new BMap.Map("allmap"); // 创建Map实例
|
var map = new BMapGL.Map("allmap");
|
var point = new BMapGL.Point(116.404, 39.915); // 创建点坐标
|
map.centerAndZoom(point, 17); // 初始化地图，设置中心点坐标和地图级别
|
|
// 添加地图类型控件
|
|
//map.addControl(new BMap.MapTypeControl({
|
// mapTypes: [
|
// BMAP_NORMAL_MAP, //此地图类型展示普通街道视图
|
// BMAP_HYBRID_MAP //此地图类型展示普通卫星地图
|
// ]
|
//}));
|
|
// 添加缩放控件
|
//map.addControl(new BMap.ZoomControl());
|
|
// 添加比例尺控件
|
//map.addControl(new BMap.ScaleControl());
|
|
//map.enableScrollWheelZoom(true);
|
|
|
// 添加地址搜索控件
|
var search = new BMapGL.LocalSearch(map, {
|
renderOptions: {
|
map: map,
|
panel: "r-result"
|
},
|
onInfoHtmlSet: function(results){
|
|
$('#SearchAddress').val(results.address);
|
},
|
onInfoHtmlSet: function(results){
|
//可以得到搜索结果且搜索结果不为空
|
if(search.getStatus() == BMAP_STATUS_SUCCESS){
|
if(results.address){address = results.address;}
|
else{address = results.title;}
|
$('#SubmitAddress').val(address);
|
}
|
},
|
pageCapacity: 5
|
});
|
//search.getStatus();
|
|
// 百度地图API功能
|
var SearchAddress = $('#SearchAddress').val();
|
if(SearchAddress==''){SearchAddress='珠江医院';}
|
search.search(SearchAddress);
|
|
|
|
// 监听地址搜索控件的结果
|
search.enableAutoViewport(); // 启用自动视野定位
|
|
map.addEventListener("click", function (e) {
|
alert('点击位置经纬度：' + e.latlng.lng + ',' + e.latlng.lat);
|
//search.search(e.latlng.lng + ',' + e.latlng.lat);
|
|
//https://lbsyun.baidu.com/jsdemo.htm#localSearchKeyPolygon
|
//var pStart = new BMapGL.Point(116.274625,39.961627);
|
//var pEnd = new BMapGL.Point(116.367474,39.988609);
|
//var bs = new BMapGL.Bounds(pStart,pEnd); //自己规定范围
|
//search.searchInBounds("银行", bs);
|
});
|
}
|
|
|
</script>
|
</head>
|
<body onload="createMap()">
|
<!--地图容器-->
|
<div id="allmap"></div>
|
<div class="col-sm-6" style="padding-top: 10px;padding-bottom: 10px;">
|
<input class="form-control" name="SearchAddress" id="SearchAddress" style="width: 80%;display: inline;" type="text" value="<%=SearchAddress%>">
|
<button class="btn btn-primary" id="Search" onclick="createMap();" type="button" style="">查询</button>
|
|
</div>
|
<div id="r-search">
|
</div>
|
<!--搜索结果列表容器-->
|
<div id="r-result"></div>
|
<div id="r-search" class="col-sm-6" style="padding-top: 10px;padding-bottom: 10px;">
|
<input class="form-control" name="SubmitAddress" id="SubmitAddress" type="text" value="<%=SubmitAddress%>">
|
<button class="btn btn-primary" id="Submit" onclick="" type="button" style="width: 80%;">提交</button>
|
</div>
|
</body>
|
</html>
|
