这几天一直忙着写高德地图的定位兼搜索功能，现在有点眉目了，但还是偶尔会出bug，希望大家有所借鉴，但更希望给提点建议
，不知好不好
我的缺点就是把三个地图整合到一块去了，分开写我实在不会，以后会的话一定分享…………
大家有想尝试的得去高德API注册一个密钥，也就是key，我这里是ada0145080deff882d2a28e8af2047ad
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>输入提示后查询</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>
<script src="../API/jquery-2.1.4.min.js"></script>
<script type="text/javascript"
src="http://webapi.amap.com/maps?v=1.3&key=ada0145080deff882d2a28e8af2047ad&plugin=AMap.Autocomplete,AMap.PlaceSearch"></script>
<link rel="stylesheet" type="text/css" href="../API/Api.css">
</head>
<body>
<div class="box_dis">
<input class="search" id="tipinput"/>
</div>
<div class="distance">
<div id="container"></div>
</div>
<div class="scroll" id="view">
<div id="panel"></div>
</div>
<div id="containe"></div>
<!--<div id="container"></div>-->
<script type="text/javascript">
window.onload = function () {
getLocation()
displayPOI()
}
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
}
}
function showPosition(position) {
var obj_info = {latitude: position.coords.latitude, longitude: position.coords.longitude};
localStorage.setItem("info", JSON.stringify(obj_info));
}
var map, geolocation;
//加载地图，调用浏览器定位服务
map = new AMap.Map('container', {
resizeEnable: true
});
$('.amap-logo').css('display','none');
$('.amap-copyright').css('display','none');
map.plugin('AMap.Geolocation', function () {
geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位，默认:true
timeout: 10000, //超过10秒后停止定位，默认：无穷大
buttonOffset: new AMap.Pixel(10, 10),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
zoomToAccuracy: true, //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
buttonPosition: 'RB'
});
map.addControl(geolocation);
geolocation.getCurrentPosition();
AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
AMap.event.addListener(geolocation, 'error', onError); //返回定位出错信息
});
var autoOptions = {
input: "tipinput"
};
var auto = new AMap.Autocomplete(autoOptions);
var placeSearch = new AMap.PlaceSearch({
map: map
}); //构造地点查询类
AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
function select(e) {
placeSearch.setCity(e.poi.adcode);
placeSearch.search(e.poi.name); //关键字查询查询
}
var dress = JSON.parse(localStorage.getItem("info"))
var map = new BMap.Map("containe");
var mPoint = new BMap.Point(dress.longitude, dress.latitude);
map.centerAndZoom(mPoint, 15);
map.enableScrollWheelZoom(); //启用滚轮缩放
var mOption = {
poiRadius: 2500, //半径为1000米内的POI,默认100米
numPois: 20 //列举出50个POI,默认10个
}
var myGeo = new BMap.Geocoder(); //创建地址解析实例
function displayPOI() {
map.addOverlay(new BMap.Circle(mPoint, 0)); //添加一个圆形覆盖物
myGeo.getLocation(mPoint,
function mCallback(rs) {
var allPois = rs.surroundingPois; //获取全部POI（该点半径为100米内有6个POI点）
for (i = 0; i < allPois.length; ++i) {
document.getElementById("panel").innerHTML += "<div class='list' id="+allPois[i].title+"><div class='site'>" + allPois[i].title +"</div><div class='site_down'>" + allPois[i].address + "</div><span class='right'><img class='tex' src='../API/outstyle091100004.jpg' id="+allPois[i].title+"></span></div></div>";
map.addOverlay(new BMap.Marker(allPois[i].point));
$('.anchorBL').css('display','none');
}
}, mOption
);
}
</script>
</body>
</html>