百度地圖API如何批量轉(zhuǎn)換為百度經(jīng)緯度
百度地圖API的官網(wǎng)上提供了常用坐標(biāo)轉(zhuǎn)換的示例。但是,一次只能轉(zhuǎn)換一個(gè),真的非常麻煩??!這里結(jié)合了官方的示例,自制一個(gè)批量轉(zhuǎn)換工具,供大家參考。

因?yàn)槲覜]有GPS坐標(biāo),就拿谷歌坐標(biāo)做個(gè)示例了。
首先要注意的是,百度和谷歌的經(jīng)緯度坐標(biāo)順序是相反的。
比如,谷歌的經(jīng)緯度是
newgoogle.maps.LatLng(39.90762965106183, 116.3786889372559)
傳入坐標(biāo)轉(zhuǎn)換接口的百度經(jīng)緯度應(yīng)該是
newBMap.Point(116.3786889372559,39.90762965106183)
所以,我建立一個(gè)數(shù)組,存放轉(zhuǎn)換前的經(jīng)緯度。創(chuàng)建百度的坐標(biāo)點(diǎn),但是用谷歌的經(jīng)緯度。
- //注意:百度和谷歌的經(jīng)緯度坐標(biāo)順序是相反的。
 - varpoints = [newBMap.Point(116.3786889372559,39.90762965106183),
 - newBMap.Point(116.38632786853032,39.90795884517671),
 - newBMap.Point(116.39534009082035,39.907432133833574),
 - newBMap.Point(116.40624058825688,39.90789300648029),
 - newBMap.Point(116.41413701159672,39.90795884517671)
 - ];
 
然后調(diào)用官方公布的接口
BMap.Convertor.transMore(points,2,callback);
自己對(duì)這個(gè)坐標(biāo)轉(zhuǎn)換接口做了修改,讓它可以多次返回結(jié)果。注意看注釋部分。
據(jù)說(shuō),百度坐標(biāo)轉(zhuǎn)換接口,有50次/秒的限制。
- functiontransMore(points,type,callback){
 - for(varindex inpoints){
 - if(index >50){return;}
 - varxyUrl = "http://api.map.baidu.com/ag/coord/convert?from=" + type +
 - "&to=4&x=" + points[index].lng + //這里要循環(huán)讀入數(shù)組points的lng數(shù)據(jù),直到points.length完畢。
 - "&y=" + points[index].lat +
 - "&callback=callback";
 - //動(dòng)態(tài)創(chuàng)建script標(biāo)簽
 - load_script(xyUrl);
 - }
 - }
 
進(jìn)過(guò)上一步,坐標(biāo)就轉(zhuǎn)換好了。成為百度坐標(biāo)了。但這時(shí)的百度坐標(biāo)是加密的??床欢?hellip;…

好在,我們可以直接利用這些加密的編碼創(chuàng)建出Marker標(biāo)注點(diǎn)。獲取到對(duì)象后,直接使用即可。
- functioncallback(xyResult){
 - if(xyResult.error != 0){return;}//出錯(cuò)就直接返回;
 - varpoint = newBMap.Point(xyResult.x, xyResult.y);
 - varmarker = newBMap.Marker(point);
 - map.addOverlay(marker);
 - map.setCenter(point);//由于寫了這句,可以每一個(gè)被轉(zhuǎn)的點(diǎn)都是中心點(diǎn)的過(guò)程
 - }
 
到這里,批量轉(zhuǎn)換就講完啦~~
下面說(shuō)說(shuō)我自己添加的其他功能:如何獲取地圖上的坐標(biāo)點(diǎn)。
如何獲取地圖上的坐標(biāo)點(diǎn),經(jīng)緯度?
先說(shuō)說(shuō)谷歌的:給地圖添加事件,點(diǎn)擊地圖后直接彈出。
- google.maps.event.addListener(map, 'click', function(e) {
 - alert(e.latLng);
 - });
 
在說(shuō)說(shuō)百度的,也是給地圖添加事件。
- map.addEventListener("click",function(e){
 - alert(e.point.lng + "," + e.point.lat);
 - });
 
大家發(fā)現(xiàn)谷歌和百度有什么不同了沒有?
對(duì)了,谷歌的經(jīng)緯度像是封裝在一起了樣。而百度的經(jīng)緯度是分開地~~~
全部源代碼:
有兩個(gè)文件,一個(gè)是htm,另一個(gè)是修改后的官方坐標(biāo)轉(zhuǎn)換js。
批量轉(zhuǎn)換.htm
- <!DOCTYPE html>
 - <html>
 - <head>
 - <meta http-equiv="Content-Type"content="text/html; charset=gb2312"/>
 - <script type="text/javascript"src="changeMore.js"></script>
 - <title>批量轉(zhuǎn)換坐標(biāo)</title>
 - </head>
 - <body>
 - <input onclick="magic();"value="批量轉(zhuǎn)換"type="button"/>(據(jù)說(shuō)有50次/秒的限制哦)<hr />
 - <div style="clear:both">
 - <div style="float:left;">
 - <h4>谷歌地圖</h4>
 - <div style="width:520px;height:340px;border:1px solid gray"id="map_canvas"></div>
 - <p>鼠標(biāo)點(diǎn)擊的谷歌坐標(biāo)是:<span id="info"></span></p>
 - <script type="text/javascript"src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
 - <script type="text/javascript">
 - functioninitialize() {varmyOptions ={
 - zoom: 14,
 - center: newgoogle.maps.LatLng(39.90861722866082, 116.39679921252446),
 - mapTypeId: google.maps.MapTypeId.ROADMAP
 - };varmap =newgoogle.maps.Map(document.getElementById('map_canvas'),myOptions);
 - google.maps.event.addListener(map, 'click', function(e) {
 - document.getElementById("info").innerHTML =e.latLng;
 - });varmarker1 =newgoogle.maps.Marker({
 - position: newgoogle.maps.LatLng(39.90762965106183, 116.3786889372559),
 - map: map
 - });varmarker2 =newgoogle.maps.Marker({
 - position: newgoogle.maps.LatLng(39.90795884517671, 116.38632786853032),
 - map: map
 - });varmarker3 =newgoogle.maps.Marker({
 - position: newgoogle.maps.LatLng(39.907432133833574, 116.39534009082035),
 - map: map
 - });varmarker4 =newgoogle.maps.Marker({
 - position: newgoogle.maps.LatLng(39.90789300648029, 116.40624058825688),
 - map: map
 - });varmarker5 =newgoogle.maps.Marker({
 - position: newgoogle.maps.LatLng(39.90795884517671, 116.41413701159672),
 - map: map
 - });
 - }
 - google.maps.event.addDomListener(window, 'load', initialize);</script>
 - </div>
 - <div style="float:left;">
 - <h4>百度地圖</h4>
 - <div style="width:520px;height:340px;border:1px solid gray"id="container"></div>
 - <p>鼠標(biāo)點(diǎn)擊的百度坐標(biāo)是:(<span id="info2"></span>)</p>
 - <script type="text/javascript"src="http://api.map.baidu.com/api?v=1.2"></script>
 - <script type="text/javascript">
 - varmap =newBMap.Map("container");
 - map.centerAndZoom(newBMap.Point(116.404, 39.915), 15);vari;varmarkers =[];
 - map.addEventListener("click",function(e){
 - document.getElementById("info2").innerHTML =e.point.lng +","+e.point.lat;
 - });//注意:百度和谷歌的經(jīng)緯度坐標(biāo)順序是相反的。
 - varpoints =[newBMap.Point(116.3786889372559,39.90762965106183),newBMap.Point(116.38632786853032,39.90795884517671),newBMap.Point(116.39534009082035,39.907432133833574),newBMap.Point(116.40624058825688,39.90789300648029),newBMap.Point(116.41413701159672,39.90795884517671)
 - ];functioncallback(xyResult){ if(xyResult.error !=0){return;}//出錯(cuò)就直接返回;varpoint =newBMap.Point(xyResult.x, xyResult.y);varmarker =newBMap.Marker(point);
 - map.addOverlay(marker);
 - map.setCenter(point);//由于寫了這句,可以每一個(gè)被轉(zhuǎn)的點(diǎn)都是中心點(diǎn)的過(guò)程
 - }functionmagic(){
 - BMap.Convertor.transMore(points,2,callback);
 - }</script>
 - </div>
 - </div>
 - </body>
 - </html>
 - changeMore.js
 - //2011-7-25 zhangying
 - (function(){
 - functionload_script(xyUrl, callback){
 - varhead = document.getElementsByTagName('head')[0];
 - varscript = document.createElement('script');
 - script.type = 'text/javascript';
 - script.src = xyUrl;
 - //借鑒了jQuery的script跨域方法
 - scriptscript.onload = script.onreadystatechange = function(){
 - if((!this.readyState || this.readyState === "loaded" || this.readyState === "complete")){
 - callback &&callback();
 - //Handle memory leak in IE
 - scriptscript.onload = script.onreadystatechange = null;
 - if( head &&script.parentNode ) {
 - head.removeChild( script );
 - }
 - }
 - };
 - //Use insertBefore instead of appendChild to circumvent an IE6 bug.
 - head.insertBefore( script, head.firstChild );
 - }
 - functiontransMore(points,type,callback){
 - for(varindex inpoints){
 - if(index >50){return;}
 - varxyUrl = "http://api.map.baidu.com/ag/coord/convert?from=" + type +
 - "&to=4&x=" + points[index].lng + //這里要循環(huán)讀入數(shù)組points的lng數(shù)據(jù),直到points.length完畢。
 - "&y=" + points[index].lat +
 - "&callbackcallback=callback";
 - //動(dòng)態(tài)創(chuàng)建script標(biāo)簽
 - load_script(xyUrl);
 - }
 - }
 - windowwindow.BMap = window.BMap || {};
 - BMap.Convertor = {};
 - BMap.Convertor.transMore = transMore;
 - })();
 
原文鏈接:http://www.cnblogs.com/milkmap/archive/2011/09/29/2195780.html
【編輯推薦】















 
 
 




 
 
 
 