location.html
5.7 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="log"></div>
<input type="number" placeholder="123132">
<script type="text/javascript" src = 'https://webapi.amap.com/maps?v=1.4.4&test=true&key=8e9d3050695ac868cc67257d84a5f740&plugin=AMap.ToolBar,AMap.IndoorMap'></script>
<script type="text/javascript">
var log = document.getElementsByClassName('log')[0];
mapObj = new AMap.Map('iCenter');
mapObj.plugin('AMap.Geolocation', function () {
geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位，默认:true
timeout: 10000, //超过10秒后停止定位，默认：无穷大
maximumAge: 0, //定位结果缓存0毫秒，默认：0
convert: true, //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
showButton: true, //显示定位按钮，默认：true
buttonPosition: 'LB', //定位按钮停靠位置，默认：'LB'，左下角
buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
showMarker: true, //定位成功后在定位到的位置显示点标记，默认：true
showCircle: true, //定位成功后用圆圈表示定位精度范围，默认：true
panToLocation: true, //定位成功后将定位到的位置作为地图中心点，默认：true
zoomToAccuracy:true //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
});
mapObj.addControl(geolocation);
geolocation.getCurrentPosition();
AMap.event.addListener(geolocation, 'complete', function(obj){
var res = '经纬度：' + obj.position +
'\n精度范围：' + obj.accuracy +
'米\n定位结果的来源：' + obj.location_type +
'\n状态信息：' + obj.info +
'\n地址：' + obj.formattedAddress +
'\n地址信息：' + JSON.stringify(obj.addressComponent, null, 4);
console.log(res)
AMap.service(["AMap.PlaceSearch"], function() {
var placeSearch = new AMap.PlaceSearch({
pageSize: 10, // 每页10条
pageIndex: 1, // 获取第一页
city: res.province// 指定城市名(如果你获取不到城市名称，这个参数也可以不传，注释掉)
});
// 第一个参数是关键字，这里传入的空表示不需要根据关键字过滤
// 第二个参数是经纬度，数组类型
// 第三个参数是半径，周边的范围
// 第四个参数为回调函数
placeSearch.searchNearBy(app.cityname, [obj.position], 1000, function(status, result) {
console.log(JSON.stringify(status))
if(result.info === 'OK') {
var locationList = result.poiList.pois; // 周边地标建筑列表
//console.log(JSON.stringify(locationList))
app.nearList = locationList // 生成地址列表html
// createLocationHtml(locationList);
} else {
console.log('获取位置信息失败!');
}
});
});
});//返回定位信息
AMap.event.addListener(geolocation, 'error', onError); //返回定位出错信息
});
function onComplete(obj){
var res = '经纬度：' + obj.position +
'\n精度范围：' + obj.accuracy +
'米\n定位结果的来源：' + obj.location_type +
'\n状态信息：' + obj.info +
'\n地址：' + obj.formattedAddress +
'\n地址信息：' + JSON.stringify(obj.addressComponent, null, 4);
console.log(res)
AMap.service(["AMap.PlaceSearch"], function() {
var placeSearch = new AMap.PlaceSearch({
pageSize: 10, // 每页10条
pageIndex: 1, // 获取第一页
city: res.province// 指定城市名(如果你获取不到城市名称，这个参数也可以不传，注释掉)
});
// 第一个参数是关键字，这里传入的空表示不需要根据关键字过滤
// 第二个参数是经纬度，数组类型
// 第三个参数是半径，周边的范围
// 第四个参数为回调函数
placeSearch.searchNearBy(app.cityname, [obj.position], 1000, function(status, result) {
console.log(JSON.stringify(status))
if(result.info === 'OK') {
var locationList = result.poiList.pois; // 周边地标建筑列表
//console.log(JSON.stringify(locationList))
app.nearList = locationList // 生成地址列表html
// createLocationHtml(locationList);
} else {
console.log('获取位置信息失败!');
}
});
});
}
function onError(obj) {
alert(obj.info + '--' + obj.message);
console.log(obj);
}
</script>
//获取位置按钮
<button class = 'bt' onclick='geo.getCurrentPosition()'>获取位置</button>
<button class = 'bt' onclick='geo.watchPosition()'>连续定位</button>
<button class = 'bt' onclick='geo.clearWatch()'>停止定位</button>
</body>
</html>