【百度地图API】如何批量转换为百度经纬度

标签: 百度地图 api 百度 | 发表时间:2011-09-29 18:05 | 作者:酸奶小妹 Pei
出处:http://www.cnblogs.com/

摘要:

     百度地图API的官网上提供了常用坐标转换的示例。但是,一次只能转换一个,真的非常麻烦!!这里结合了官方的示例,自制一个批量转换工具,供大家参考。

------------------------------------------------------------------------------------------

因为我没有GPS坐标,就拿谷歌坐标做个示例了。

首先要注意的是,百度和谷歌的经纬度坐标顺序是相反的。

比如,谷歌的经纬度是

new google.maps.LatLng(39.90762965106183, 116.3786889372559)

传入坐标转换接口的百度经纬度应该是

new BMap.Point(116.3786889372559,39.90762965106183)

所以,我建立一个数组,存放转换前的经纬度。创建百度的坐标点,但是用谷歌的经纬度。

//注意:百度和谷歌的经纬度坐标顺序是相反的。
var points = [new BMap.Point(116.3786889372559,39.90762965106183),
new BMap.Point(116.38632786853032,39.90795884517671),
new BMap.Point(116.39534009082035,39.907432133833574),
new BMap.Point(116.40624058825688,39.90789300648029),
new BMap.Point(116.41413701159672,39.90795884517671)
];



然后调用官方公布的接口

BMap.Convertor.transMore(points,2,callback);

自己对这个坐标转换接口做了修改,让它可以多次返回结果。注意看注释部分。

据说,百度坐标转换接口,有50次/秒的限制。

function transMore(points,type,callback){
for(var index in points){
if(index > 50){return;}
var xyUrl = "http://api.map.baidu.com/ag/coord/convert?from=" + type +
"&to=4&x=" + points[index].lng + //这里要循环读入数组points的lng数据,直到points.length完毕。
"&y=" + points[index].lat +
"&callback=callback";
//动态创建script标签
load_script(xyUrl);
}
}



进过上一步,坐标就转换好了。成为百度坐标了。但这时的百度坐标是加密的。看不懂……

好在,我们可以直接利用这些加密的编码创建出Marker标注点。获取到对象后,直接使用即可。

function callback(xyResult){ 
if(xyResult.error != 0){return;}//出错就直接返回;
var point = new BMap.Point(xyResult.x, xyResult.y);
var marker = new BMap.Marker(point);
map.addOverlay(marker);
map.setCenter(point);// 由于写了这句,可以每一个被转的点都是中心点的过程
}

到这里,批量转换就讲完啦~~

下面说说我自己添加的其他功能:如何获取地图上的坐标点。

---------------------------------------------------------------------------------------------

如何获取地图上的坐标点,经纬度?

先说说谷歌的:给地图添加事件,点击地图后直接弹出。

google.maps.event.addListener(map, 'click', function(e) {
alert(e.latLng);
});

在说说百度的,也是给地图添加事件。

map.addEventListener("click",function(e){
alert(e.point.lng + "," + e.point.lat);
});



大家发现谷歌和百度有什么不同了没有?

对了,谷歌的经纬度像是封装在一起了样。而百度的经纬度是分开地~~~


----------------------------------------------------------------------------------------

全部源代码:

有两个文件,一个是htm,另一个是修改后的官方坐标转换js。

批量转换.htm
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script type="text/javascript" src="changeMore.js"></script>
<title>批量转换坐标</title>
</head>
<body>
<input onclick="magic();" value="批量转换" type="button" />(据说有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>鼠标点击的谷歌坐标是:<span id="info"></span></p>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var myOptions = {
zoom:
14,
center:
new google.maps.LatLng(39.90861722866082, 116.39679921252446),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map_canvas'),myOptions);
google.maps.event.addListener(map,
'click', function(e) {
document.getElementById(
"info").innerHTML = e.latLng;
});
var marker1 = new google.maps.Marker({
position:
new google.maps.LatLng(39.90762965106183, 116.3786889372559),
map: map
});
var marker2 = new google.maps.Marker({
position:
new google.maps.LatLng(39.90795884517671, 116.38632786853032),
map: map
});
var marker3 = new google.maps.Marker({
position:
new google.maps.LatLng(39.907432133833574, 116.39534009082035),
map: map
});
var marker4 = new google.maps.Marker({
position:
new google.maps.LatLng(39.90789300648029, 116.40624058825688),
map: map
});
var marker5 = new google.maps.Marker({
position:
new google.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>鼠标点击的百度坐标是:(<span id="info2"></span></p>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script>
<script type="text/javascript">
var map = new BMap.Map("container");
map.centerAndZoom(
new BMap.Point(116.404, 39.915), 15);
var i;
var markers = [];
map.addEventListener(
"click",function(e){
document.getElementById(
"info2").innerHTML = e.point.lng + "," + e.point.lat;
});
//注意:百度和谷歌的经纬度坐标顺序是相反的。
var points = [new BMap.Point(116.3786889372559,39.90762965106183),
new BMap.Point(116.38632786853032,39.90795884517671),
new BMap.Point(116.39534009082035,39.907432133833574),
new BMap.Point(116.40624058825688,39.90789300648029),
new BMap.Point(116.41413701159672,39.90795884517671)
];
function callback(xyResult){
if(xyResult.error != 0){return;}//出错就直接返回;
var point = new BMap.Point(xyResult.x, xyResult.y);
var marker = new BMap.Marker(point);
map.addOverlay(marker);
map.setCenter(point);
// 由于写了这句,可以每一个被转的点都是中心点的过程
}
function magic(){
BMap.Convertor.transMore(points,
2,callback);
}
</script>
</div>
</div>
</body>
</html>

changeMore.js
//2011-7-25 zhangying
(function(){
function load_script(xyUrl, callback){
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = xyUrl;
//借鉴了jQuery的script跨域方法
script.onload = script.onreadystatechange = function(){
if((!this.readyState || this.readyState === "loaded" || this.readyState === "complete")){
callback && callback();
// Handle memory leak in IE
script.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 );
}
function transMore(points,type,callback){
for(var index in points){
if(index > 50){return;}
var xyUrl = "http://api.map.baidu.com/ag/coord/convert?from=" + type +
"&to=4&x=" + points[index].lng + //这里要循环读入数组points的lng数据,直到points.length完毕。
"&y=" + points[index].lat +
"&callback=callback";
//动态创建script标签
load_script(xyUrl);
}
}

window.BMap = window.BMap || {};
BMap.Convertor = {};
BMap.Convertor.transMore = transMore;
})();

作者: 酸奶小妹 发表于 2011-09-29 18:05 原文链接

评论: 2 查看评论 发表评论


最新新闻:
· 明年3月8日就要告别 Windows 8开发者预览版(2011-09-30 11:02)
· 铝制背壳回归?iPhone 5概念真机曝光(2011-09-30 11:01)
· 中国联通:iPhone 5将支持HSPA+(2011-09-30 10:59)
· Win8开发者预览版自动向微软发送用户硬件/软件数据(2011-09-30 10:56)
· 50年最伟大科技发明:iPhone第一Walkman第二(2011-09-30 10:55)

编辑推荐:最老程序员创业札记:全文检索、数据挖掘、推荐引擎应用38

网站导航:博客园首页  我的园子  新闻  闪存  小组  博问  知识库

相关 [百度地图 api 百度] 推荐:

百度地图API--HelloWorld

- - CSDN博客推荐文章
百度地图API--Hello World.           这里引用一个经典的单词"Hello World",这个词是程序界所有人都很熟悉的,我在开始学习Java的时候就是从这开始的,什么编写一个Hello World程序,甚至有的面试题中有“写一个输出Hello World的程序”来测试面试者的面向对象的思维.

百度地图API--标注域

- - CSDN博客Web前端推荐文章
我们可以在地图上添加一些本文覆盖物,用来标注一些信息,前一节我们学习了标注点的使用以及标注点的点击和拖拽事件,标注点用到了BMap命名空间下的Marker类,文本标注域则是用到了Label类,下面介绍如何添加一个文本标注域. position : map.getCenter(), // 指定文本标注所在的地理位置.

百度地图api之如何自定义标注图标

- - CSDN博客Web前端推荐文章
      在百度地图api中,默认的地图图标是一个红色的椭圆形. 但是在项目中常常要求我们建立自己的图标,类似于我的这个. 操作很简单,分如下几步进行. 步骤一:先ps一个图标,大小要合适,如果要背景透明的,记得保存成png格式. 推荐一个在线ps网站 http://uupoop.com/. 做好图片之后,如果你使用vs或其他控制谈调用的百度地图api,要把图片放到debug文件夹中.

【百度地图API】如何批量转换为百度经纬度

- Pei - 博客园-首页原创精华区
     百度地图API的官网上提供了常用坐标转换的示例. 但是,一次只能转换一个,真的非常麻烦. 这里结合了官方的示例,自制一个批量转换工具,供大家参考. 因为我没有GPS坐标,就拿谷歌坐标做个示例了. 首先要注意的是,百度和谷歌的经纬度坐标顺序是相反的. 传入坐标转换接口的百度经纬度应该是. 所以,我建立一个数组,存放转换前的经纬度.

百度地图推出卫星地图

- 丁丁 - 月光博客
  据百度地图微博报道,11月15日,百度地图正式上线卫星地图功能,目前首批覆盖的城市包括北京、上海、广州、深圳等35个城市,由中国四维提供影像数据.   卫星地图是百度地图新增加的地图浏览模式,目前用户可以在百度地图中选择使用“地图”、“卫星”和“三维”三种不同的视图. 通过新增的的“卫星地图”模式,用户可以看到真实的遥感卫星图像,查看到原有地图上无法涵盖的细节.

phonegap利用百度地图sdk定位

- - snoopyxdy的博客
近期的一个phonegap项目把我做的焦头烂额,最让人蛋疼的就是安卓4.1.x对html5的定位获取经纬度有个无比巨大的坑,一般我们利用如下代码进行html5的定位. 另外一个巨坑也直接影响了我对这个问题的判断,如果我重启了安卓4.1的机器,那么上述代码将能够正常跑大约几小时,甚至半天,可是到了第二天又会出现同样的问题,无尽的timeout.

【支持定位支持离线包】百度地图

- Daimon - 爱Apps - www.iapps.im
精选限时免费应用,由 AppPusher 为您送达. 无限精彩,尽在 爱Apps - www.iapps.im. 本站原创内容,转载时请务必注明出处,谢谢. 大小: 3.8 MB 系统: 3.0+. 百度地图出了,小编实测了一下,定位很准确,而百度地图本身的资源也是比较新的,这款刚上架不久的百度地图,适合iPhone和iPod,支持手机内下载各省市离线包(很遗憾没发现电脑端传输功能),基本上略大点的二三线城市都有,还是很不错的,大家可以试试.

百度地图SDK for Android【Demo Place详情页】

- - CSDN博客移动开发推荐文章
        Place详情展示页面可以帮助开发者便捷的展示Poi详情信息,此外通过详情展示页面您还可以实现电话的拨打等功能. 今天将向大家介绍Place详情页的具体使用方法.         第一步,创建工程,并放置基础地图mapview控件(详细介绍请参考: 百度地图SDK for Android【Demo地图展示】 ).

百度地图为何让开发者缺乏安全感?

- - 创业邦
  在厦门有一个小的O2O圈子,它们从事领域丰富,从运动社区到本地垂直服务乃至情趣电商,因为这样或那样的原因,他们都未走入一线城市. 深耕本地化的他们作为O2O从业者的典型代表对各家地图服务更有发言权. 在聊天中,巴人发现,他们都在LBS服务上不约而同的选择了百度地图,而其中也有开发者刚刚从其它平台切换至百度,面对这样一边倒的局面,首先声明,他们未受利益驱动,纯属自发行为.

分布式大数据多维分析(OLAP)引擎:Apache Kylin 在百度地图的实践

- - leejun2005的个人页面
百度地图开放平台业务部数据智能组主要负责百度地图内部相关业务的大数据计算分析,处理日常百亿级规模数据,为不同业务提供单条SQL毫秒级响应的OLAP多维分析查询服务. 对于Apache Kylin在实际生产环境中的应用,在国内,百度地图数据智能组是最早的一批实践者之一. Apache Kylin在2014年11月开源,当时,我们团队正需要搭建一套完整的大数据OLAP分析计算平台,用来提供百亿行级数据单条SQL毫秒到秒级的多维分析查询服务,在技术选型过程中,我们参考了Apache Drill、Presto、Impala、Spark SQL、Apache Kylin等.