基于JavaScript定位当前的地理位置
程序员文章站
2022-05-26 11:13:09
本文实例为大家分享了js定位当前地理位置的具体代码，供大家参考，具体内容如下
本文实例为大家分享了js定位当前地理位置的具体代码，供大家参考，具体内容如下
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
<title>title</title>
</head>
<body>
您目前在<p></p>
</body>
<script>
//定义一个空的位置构造函数
function location(){};
//定义一个可以获得经纬度的方法
location.prototype.getlocation = function(callback){
var options = {
enablehighaccuracy: true,
maximumage: 1000
};
this.callback = object.prototype.tostring.call(callback) =="[object function]" ?
callback :
function(address){
alert(address.province + address.city);
console.log("getocation(callbackfunction) 可获得定位信息对象");
};
var self = this;
if (navigator.geolocation) {
//浏览器支持geolocation
navigator.geolocation.getcurrentposition(function(position){
//经度
var longitude = position.coords.longitude;
//纬度
var latitude = position.coords.latitude;
self.loadmapapi(longitude,latitude);
}, self.onerror, options);
} else {
//浏览器不支持geolocation
}
};
//定义一个可以解析经纬度的方法，调用百度的api
location.prototype.loadmapapi = function(longitude, latitude){
var self = this;
var ohead = document.getelementsbytagname('head').item(0);
var oscript= document.createelement("script");
oscript.type = "text/javascript";
oscript.src="http://api.map.baidu.com/getscript?v=2.0&ak=a396783ee700cfdb9ba1df281ce36862&services=&t=20140930184510";
ohead.appendchild(oscript);
oscript.onload = function(date){
var point = new bmap.point(longitude, latitude);
var gc = new bmap.geocoder();
gc.getlocation(point, function(rs) {
var addcomp = rs.addresscomponents;
self.callback(addcomp);
});
}
};
//定义出现查询位置出现意外的方法
location.prototype.onerror = function(error) {
switch (error.code) {
case 1:
alert("位置服务被拒绝");
break;
case 2:
alert("暂时获取不到位置信息");
break;
case 3:
alert("获取信息超时");
break;
case 4:
alert("未知错误");
break;
}
};
//调用
var local = new location();
local.getlocation(function(res){
var str=""
for(i in res ){
str=res[i]+str
}
document.queryselector("p").innerhtml=str;
})
</script>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。