高德地图定位!
demo
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- <meta name="keywords" content="<?php echo $config['seo_keywords'];?>" />
<meta name="description" content="<?php echo $config['seo_description'];?>" />
<meta name="HandheldFriendly" content="true"/>
<meta name="MobileOptimized" content="320"/>
<meta name="format-detection" content="telephone=no"/>
<meta http-equiv="cleartype" content="on"/> -->
引入高德
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.5&key=你的key值"></script>
<title>Document</title>
</head>
<body>
<input type="text" name="" id="tipinput"> 设置一个文本框用来方便输入地址定位
<div id="container" style="height: 400px;width: 100%;border:1px solid red;"></div> 地图所放的位置
</body>
</html>
<script type="text/javascript">
var lng = lng || 116.39773;
var lat = lat || 39.907815;
var map = new AMap.Map("container", {
resizeEnable: true,调整任意窗口大小
center: [lng, lat],
zoom: 10
});
var marker = new AMap.Marker({
position: [lng, lat],
zoom: 10
});
marker.setMap(map);
//输入提示
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) {
setLenLat([e.poi.location.lng,e.poi.location.lat]);
}
map.on('click', function(e) {
console.log(e);
var lnglat = [e.lnglat.lng,e.lnglat.lat];
setLenLat(lnglat);
});
function setLenLat(lnglat){
map.clearMap();
map.setCenter(lnglat);
var marker = new AMap.Marker({
position: lnglat,
zoom: 10
});
marker.setMap(map);
console.log(lnglat);
ediell(lnglat[0],lnglat[1])
}
function ediell(lng,lat){
$("input[name='lng']").val(lng);
$("input[name='lat']").val(lat);
$("input[name='lat_status']").val(1);
}
</script>