webview中嵌套html实现精准定位（百度地图、高德地图、腾讯地图、H5原生定位）js对比 |
您所在的位置：网站首页 › 移动端h5怎么做地图定位功能 › webview中嵌套html实现精准定位（百度地图、高德地图、腾讯地图、H5原生定位）js对比 |
webview中嵌套html实现精准定位（百度地图、高德地图、腾讯地图、H5原生定位）js对比
|
最近在实现一个功能，就是在安卓手机和苹果手机嵌入html代码，实现精准定位，我为此对比几种定位的方法。我要的是精准定位，就是误差在100米左右的功能，类似与外卖app那种定位精确度 首先是原生h5定位 if(browser.versions.android){ var options={ enableHighAccuracy:true, maximumAge:1000, timeout:5000 } if(navigator.geolocation){ //浏览器支持geolocation navigator.geolocation.getCurrentPosition(onSuccess,onError,options); }else{ //浏览器不支持geolocation errGoIndex('您的浏览器不支持地理位置定位'); }h5定位 如果高精度开启为true的话，默认会开启gps,基本定位是很精准的，但是呢必须要授权，但是有个问题是在ios10系统之上的时候,由于苹果对安全这块要求更严格了，所以必须支持https才能使用h5定位，所以呢我们暂时无法全部替换到https请求，所以此方法暂时无法使用。 使用百度地图定位 // 百度地图API功能 var map = new BMap.Map("allmap"); var point = new BMap.Point(116.331398,39.897445); map.centerAndZoom(point,12); var geolocation = new BMap.Geolocation(); geolocation.getCurrentPosition(function(r){ if(this.getStatus() == BMAP_STATUS_SUCCESS){ var mk = new BMap.Marker(r.point); map.addOverlay(mk); map.panTo(r.point); alert('您的位置：'+r.point.lng+','+r.point.lat); } else { alert('failed'+this.getStatus()); } },{enableHighAccuracy: true})这里使用的是百度浏览器定位功能，因为原生态h5定位也是使用浏览器定位，所以定位也是比较准确的，但是呢经过测试，只在苹果上定位是很准确的，但是呢在安卓上定位不准确，所以该方法也无法使用。 腾讯地图定位 var geolocation = new qq.maps.Geolocation("KQYBZ-Z5G3P-RLDDI-VI3T4-WPKXK-R7B4G", "myapp"); if (geolocation) { var options = {timeout: 15000}; geolocation.getLocation(onSuccess, showErr, options); } else { errGoIndex("定位尚未加载"); }腾讯地图默认支持h5定位，所以他们推出了以上代码，经过测试使用，我们在苹果上定位很准确，有时候呢在安卓上的定位也准确，有时候不准确，这也是它的弊端吧，但是呢，它不用请求是https，这一点还是很方便的。 高德地图定位 /*************************************** 由于Chrome、IOS10等已不再支持非安全域的浏览器定位请求，为保证定位成功率和精度，请尽快升级您的站点到HTTPS。 ***************************************/ var map, geolocation; //加载地图，调用浏览器定位服务 map = new AMap.Map('container', { resizeEnable: true }); map.plugin('AMap.Geolocation', function () { geolocation = new AMap.Geolocation({ enableHighAccuracy: true,//是否使用高精度定位，默认:true timeout: 15000, //超过15秒后停止定位，默认：无穷大 buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20) zoomToAccuracy: false, //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false buttonPosition: 'RB' }); map.addControl(geolocation); geolocation.getCurrentPosition(); AMap.event.addListener(geolocation, 'complete', onSuccess);//返回定位信息 AMap.event.addListener(geolocation, 'error', onError); //返回定位出错信息 });经过很多的定位代码和不同的定位测试，发现了高德的定位还是很准确的，无论是安卓还是苹果端都是很完美的精确定位，主要是因为高德定位采用了原生h5定位加上浏览器和ip定位多种组合，所以保证了定位的准确性,后面经过多次测试发现，在安卓部分手机定位会失败的情况，很不稳定，目前还不知道原因。 最后附上一张定位图：  经过兼容安卓苹果对比发现定位：高德定位>腾讯定位>百度定位>h5
|
【本文地址】
今日新闻 |
推荐新闻 |