html 高德地图坐标,百度地图，高德地图，HTML5经纬度比较
對于一個地點的經緯度，是確定的？這個問題，我想很多人都會回答，肯定了，可實際上呢？我只能呵呵了。
在使用百度地圖的過程中，發現一個很奇怪的現象，有時候調用百度地圖js API時，后得到一個錯的離譜的地方。然后我自己也就研究了一下jsAPI獲取地理位置的相關信息，jsAPI其實都是利用了HTML5中的方法獲取地理信息的。但很奇怪，使用HTML5獲取到的經緯度和百度獲取的竟然相差很大。
HTML5獲取到的經緯度
functiongetLocation()?{
if(navigator.geolocation)?{
navigator.geolocation.getCurrentPosition(showPosition);
}
else{alert("Geolocation?is?not?supported?by?this?browser.")?}
}
functionshowPosition(position)
{
$("#lngl").val(position.coords.longitude?);
$("#latl").val(position.coords.latitude);
}
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
}
else {alert( "Geolocation is not supported by this browser.") }
}
function showPosition(position)
{
$("#lngl").val(position.coords.longitude );
$("#latl").val(position.coords.latitude);
}
百度地圖獲取經緯度的方法
//?百度地圖API功能
varmap?=newBMap.Map("allmap");
varcircle?=newBMap.Geolocation();
varoptions={};
options.enableHighAccuracy=true;
options.timeout=10;
options.maximumAge=0;
circle.getCurrentPosition(locationResult,?options);??//enableHighAccuracy?Boolean?要求瀏覽器獲取最佳結果。,timeout????Number??超時時間。,maximumAge????Number??允許返回指定時間內的緩存結果。如果此值為0，則瀏覽器將立即獲取新定位結果。
map.addOverlay(circle);
vartempGeocoder?=newBMap.Geocoder();
functionlocationResult(geolocationResult)?{
varStatus?=this.getStatus()
if(Status?==?0)//檢索成功。對應數值“0”。
{
$("#lngBaidu").val(geolocationResult.point.lng);
$("#latBaidu").val(geolocationResult.point.lat);
varaddress?=?geolocationResult.address;
$("#cityBaidu").val(address.city);
$("#districtBaidu").val(address.district);
$("#streetBaidu").val(address.street);
else{
alert("定位失敗錯誤碼"+?Status)
}
}
// 百度地圖API功能
var map = new BMap.Map("allmap");
var circle = new BMap.Geolocation();
var options={};
options.enableHighAccuracy=true;
options.timeout=10;
options.maximumAge=0;
circle.getCurrentPosition(locationResult, options); //enableHighAccuracyBoolean要求瀏覽器獲取最佳結果。,timeoutNumber超時時間。,maximumAgeNumber允許返回指定時間內的緩存結果。如果此值為0，則瀏覽器將立即獲取新定位結果。
map.addOverlay(circle);
var tempGeocoder = new BMap.Geocoder();
function locationResult(geolocationResult) {
var Status = this.getStatus()
if (Status == 0)//檢索成功。對應數值“0”。
{
$("#lngBaidu").val(geolocationResult.point.lng);
$("#latBaidu").val(geolocationResult.point.lat);
var address = geolocationResult.address;
$("#cityBaidu").val(address.city);
$("#districtBaidu").val(address.district);
$("#streetBaidu").val(address.street);
else {
alert("定位失敗錯誤碼" + Status)
}
}高德地圖獲取經緯的方法
//?高德地圖API功能
varmapObj,?geolocation;
varMGeocoder;
mapObj?=?newAMap.Map('allmap1');
mapObj.plugin('AMap.Geolocation',function()?{
geolocation?=?newAMap.Geolocation({
enableHighAccuracy:?true,//是否使用高精度定位，默認:true
timeout:?10000,??????????//超過10秒后停止定位，默認：無窮大
maximumAge:?0,???????????//定位結果緩存0毫秒，默認：0
convert:?false,//自動偏移坐標，偏移后的坐標為高德坐標，默認：true
showButton:?false,//顯示定位按鈕，默認：true
buttonPosition:?'LB',//定位按鈕停靠位置，默認：'LB'，左下角
buttonOffset:?newAMap.Pixel(10,?20),//定位按鈕與設置的停靠位置的偏移量，默認：Pixel(10,?20)
showMarker:?false,//定位成功后在定位到的位置顯示點標記，默認：true
showCircle:?false,//定位成功后用圓圈表示定位精度范圍，默認：true
panToLocation:?true,//定位成功后將定位到的位置作為地圖中心點，默認：true
zoomToAccuracy:?true//定位成功后調整地圖視野范圍使定位位置及精度范圍視野內可見，默認：false
});
mapObj.addControl(geolocation);
AMap.event.addListener(geolocation,?'complete',?onComplete);//返回定位信息
AMap.event.addListener(geolocation,?'error',?onError);//返回定位出錯信息
geolocation.getCurrentPosition();
});
functiononComplete(data)?{
varlnglatXY?=?[data.position.getLng(),?data.position.getLat()];
$("#accuracy").val(data.accuracy);
$("#lng").val(data.position.getLng());
$("#lat").val(data.position.getLat());
}
functiononError(data)?{
varstr?='定位失敗;';
str?+=?'錯誤信息：'
switch(data.info)?{
case'PERMISSION_DENIED':
str?+=?'瀏覽器阻止了定位操作';
break;
case'POSITION_UNAVAILBLE':
str?+=?'無法獲得當前位置';
break;
case'TIMEOUT':
str?+=?'定位超時';
break;
default:
str?+=?'未知錯誤';
break;
}
alert(str);
}
// 高德地圖API功能
var mapObj, geolocation;
var MGeocoder;
mapObj = new AMap.Map('allmap1');
mapObj.plugin('AMap.Geolocation', function () {
geolocation = new AMap.Geolocation({
enableHighAccuracy: true, //是否使用高精度定位，默認:true
timeout: 10000, //超過10秒后停止定位，默認：無窮大
maximumAge: 0, //定位結果緩存0毫秒，默認：0
convert: false, //自動偏移坐標，偏移后的坐標為高德坐標，默認：true
showButton: false, //顯示定位按鈕，默認：true
buttonPosition: 'LB', //定位按鈕停靠位置，默認：'LB'，左下角
buttonOffset: new AMap.Pixel(10, 20), //定位按鈕與設置的停靠位置的偏移量，默認：Pixel(10, 20)
showMarker: false, //定位成功后在定位到的位置顯示點標記，默認：true
showCircle: false, //定位成功后用圓圈表示定位精度范圍，默認：true
panToLocation: true, //定位成功后將定位到的位置作為地圖中心點，默認：true
zoomToAccuracy: true //定位成功后調整地圖視野范圍使定位位置及精度范圍視野內可見，默認：false
});
mapObj.addControl(geolocation);
AMap.event.addListener(geolocation, 'complete', onComplete); //返回定位信息
AMap.event.addListener(geolocation, 'error', onError); //返回定位出錯信息
geolocation.getCurrentPosition();
});
function onComplete(data) {
var lnglatXY = [data.position.getLng(), data.position.getLat()];
$("#accuracy").val(data.accuracy);
$("#lng").val(data.position.getLng());
$("#lat").val(data.position.getLat());
}
function onError(data) {
var str = '定位失敗;';
str += '錯誤信息：'
switch (data.info) {
case 'PERMISSION_DENIED':
str += '瀏覽器阻止了定位操作';
break;
case 'POSITION_UNAVAILBLE':
str += '無法獲得當前位置';
break;
case 'TIMEOUT':
str += '定位超時';
break;
default:
str += '未知錯誤';
break;
}
alert(str);
}
使用這三種方法獲取的經緯度竟然有很大不同！！
小數點后第一位就有可能不一樣了，小數點后第二位是肯定不一樣的，0.01的偏差就會導致幾十公里的偏差，測試多次依然是這樣。
最后在百度地圖的官方文檔找到了這樣的的話
百度地圖坐標轉換API是一套以HTTP形式提供的坐標轉換接口，用于將常用的非百度坐標(目前支持GPS設備獲取的坐標、google地圖坐標、soso地圖坐標、amap地圖坐標、mapbar地圖坐標)轉換成百度地圖中使用的坐標，并可將轉化后的坐標在百度地圖JavaScript API、車聯網API、靜態圖API、web服務API等產品中使用。注意Android SDK、iOS SDK、定位SDK和導航SDK坐標轉換服務需單獨申請
才知道HTML5得到的數據是需要轉化之后才是百度地圖的經緯度。難怪測試了很多次，幾乎都有這么大的偏差。
HTML5經緯度轉化為百度地圖經緯度的方法：
varggPoint?=newBMap.Point(position.coords.longitude,?position.coords.latitude);//HTML5的經緯度
varconvertor?=newBMap.Convertor();
varpointArr?=?[];
pointArr.push(ggPoint);
convertor.translate(pointArr,?1,?5,?translateCallback)
}
//坐標轉換完之后的回調函數
translateCallback?=?function(data)?{
if(data.status?===?0)?{
//??data.points[0];
//轉換后的百度坐標(正確)
$("#lngz").val(data.points[0].lng);
$("#latz").val(data.points[0].lat);
}
}
var ggPoint = new BMap.Point(position.coords.longitude, position.coords.latitude);//HTML5的經緯度
var convertor = new BMap.Convertor();
var pointArr = [];
pointArr.push(ggPoint);
convertor.translate(pointArr, 1, 5, translateCallback)
}
//坐標轉換完之后的回調函數
translateCallback = function (data) {
if (data.status === 0) {
// data.points[0];
//轉換后的百度坐標(正確)
$("#lngz").val(data.points[0].lng);
$("#latz").val(data.points[0].lat);
}
}
經過這么轉化后，偏差基本上在小數點后前三位基本上都一樣了。
經過測試發現，高德地圖似乎直接使用了HTML5返回的經緯度，但沒找到相關的文檔，百度地圖使用的是轉化過的經緯度。一個簡單的經緯度問題卻由于各種原因導致了這么一個背離常識的問題，實在是令人難以理解！！
總結
以上是生活随笔為你收集整理的html 高德地图坐标,百度地图，高德地图，HTML5经纬度比较的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 游戏而已何必当真的下一句是什么啊？
- 下一篇： android clean 框架,cle