这是个好问题,移动互联网时代的来临,获取地理位置至关重要,获取地理位置分为两步,第一步通过各种手段拿到经纬度,第二步通过经纬度拿到浏览者当前所在位置的文本表示形式。
第一步如果你的网页是手机上的nativeapp,那么通过native调用系统gps很容易拿到经纬度,需要做的是在用户点击你的网页链接的时候native端将经纬度通过url参数的形式带到网页端即可。如果不方便在native端用url的形式传递的话,html5提供了GeolocationAPI接口,可以在网页上直接获得用户的经纬度,在mobile端的ios上成功率约80%以上,高端安卓机型上也还能达到50%以上,低端的安卓机器几乎没有办法,pc端的网页定位没有相关数据。
第二步拿到经纬度后,可以通过baidu的api,google的api(国内的网络放弃吧),或者SOSO的api,去解析经纬度并拿到当前地点的文本描述。
另外:不同地图有不同的坐标类型,百度地图是baidu坐标,google是国际WGS84坐标(H5的GeoLocationAPI拿到的坐标类型也为WGS84),soso是gcj02坐标(俗称soso坐标或者火星坐标,腾讯系的相关产品都是这个坐标类型)
我能给楼主的代码就只是H5 GeolocationAPI相关代码了。其余的楼主请自行Google之。
/*** H5定位* @return {[type]} [description]*/var h5_location = function() {
var h5GeoStartTime = new Date().getTime();
//H5定位成功回调函数function h5_location_succ(pos) {geoLogData.push({ //采集日志h_type: "h5",h_status: "succ",h_time: new Date().getTime() - h5GeoStartTime}); //用户统计定位数据
p_reversegeocoding({ //调用p_reversegeocodinglat: pos.coords.latitude,lng: pos.coords.longitude,reverseFrom: true,maptype: "wgs84",isNeedSug: 1}); //通过经纬度去拿当前地点的文本形式}
//h5定位失败回调function h5_location_err(err) {get_position_ready();
geoLogData.push({h_type: "h5",h_status: "failed",h_time: new Date().getTime() - h5GeoStartTime}); //用户统计定位数据//只有h5定位失败才这么提示,因为微信定位失败后还会唤起h5定位h_title.innerText = "定位失败了,请手动输入起点";}
if (navigator.geolocation) {navigator.geolocation.getCurrentPosition(h5_location_succ, h5_location_err, {enableHighAccuracy: true,timeout: 4000});} else {//异步加载jsasyncLoadJS("/static/webapp/gears_init.min.js", function() {if (window.google && google.gears) {try {var geo = google.gears.factory.create('beta.location');geo.getCurrentPosition(h5_location_succ, h5_location_err, {enableHighAccuracy: true,timeout: 4000});} catch (e) {}} else {}});}};
如有遗漏或者伙伴们有更好的建议,请直接补充即可。
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
暂无简介
文章 0 评论 0
接受
发布评论
评论(1)
这是个好问题,移动互联网时代的来临,获取地理位置至关重要,获取地理位置分为两步,第一步通过各种手段拿到经纬度,第二步通过经纬度拿到浏览者当前所在位置的文本表示形式。
第一步
如果你的网页是手机上的nativeapp,那么通过native调用系统gps很容易拿到经纬度,需要做的是在用户点击你的网页链接的时候native端将经纬度通过url参数的形式带到网页端即可。
如果不方便在native端用url的形式传递的话,html5提供了GeolocationAPI接口,可以在网页上直接获得用户的经纬度,在mobile端的ios上成功率约80%以上,高端安卓机型上也还能达到50%以上,低端的安卓机器几乎没有办法,pc端的网页定位没有相关数据。
第二步
拿到经纬度后,可以通过baidu的api,google的api(国内的网络放弃吧),或者SOSO的api,去解析经纬度并拿到当前地点的文本描述。
另外:不同地图有不同的坐标类型,百度地图是baidu坐标,google是国际WGS84坐标(H5的GeoLocationAPI拿到的坐标类型也为WGS84),soso是gcj02坐标(俗称soso坐标或者火星坐标,腾讯系的相关产品都是这个坐标类型)
我能给楼主的代码就只是H5 GeolocationAPI相关代码了。其余的楼主请自行Google之。
/**
* H5定位
* @return {[type]} [description]
*/
var h5_location = function() {
var h5GeoStartTime = new Date().getTime();
//H5定位成功回调函数
function h5_location_succ(pos) {
geoLogData.push({ //采集日志
h_type: "h5",
h_status: "succ",
h_time: new Date().getTime() - h5GeoStartTime
}); //用户统计定位数据
p_reversegeocoding({ //调用p_reversegeocoding
lat: pos.coords.latitude,
lng: pos.coords.longitude,
reverseFrom: true,
maptype: "wgs84",
isNeedSug: 1
}); //通过经纬度去拿当前地点的文本形式
}
//h5定位失败回调
function h5_location_err(err) {
get_position_ready();
geoLogData.push({
h_type: "h5",
h_status: "failed",
h_time: new Date().getTime() - h5GeoStartTime
}); //用户统计定位数据
//只有h5定位失败才这么提示,因为微信定位失败后还会唤起h5定位
h_title.innerText = "定位失败了,请手动输入起点";
}
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(h5_location_succ, h5_location_err, {
enableHighAccuracy: true,
timeout: 4000
});
} else {
//异步加载js
asyncLoadJS("/static/webapp/gears_init.min.js", function() {
if (window.google && google.gears) {
try {
var geo = google.gears.factory.create('beta.location');
geo.getCurrentPosition(h5_location_succ, h5_location_err, {
enableHighAccuracy: true,
timeout: 4000
});
} catch (e) {}
} else {}
});
}
};
如有遗漏或者伙伴们有更好的建议,请直接补充即可。