<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<script type="text/javascript" src="1.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>


//

(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;

})();

API地图坐标转化（批量转换坐标）的更多相关文章

  1. OpenGL屏幕二维坐标转化成三维模型坐标

    我们把OpenGL里模型的三维坐标往二维坐标的转化称为投影,则屏幕上的二维坐标往三维坐标转化则可以称为反投影,下面我们来介绍一下反投影的方法. 主要是gluUnProject函数的使用,下面是代码: ...

  2. 百度地图API 地图圈区域并计算坐标点是否在区域内

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 百度地图坐标纠偏和转换工具和DLL

    百度一直以来都是个即想装出一副拥抱互联网开放的样子,又为了短期商业利益封闭自己的公司,模仿谷歌地图,开放了自己的百度地图 API,为了防止别人盗用其数据和用户自由迁移,地图相比于火星坐标,又更加封闭, ...

  4. 【高德地图API】如何解决坐标转换，坐标偏移？

    http://bbs.amap.com/thread-18617-1-1.html#rd?sukey=cbbc36a2500a2e6c2b0b19115118ace519002ff3a52731f13 ...

  5. iOS 地图坐标系之间的转换WGS-84世界标准坐标、GCJ-02中国国测局(火星坐标,高德地图)、BD-09百度坐标系转换

    开发过程中遇到地图定位不准确,存在偏差.首先确认你获取到的坐标所在坐标系跟地图数据是不是相匹配的. 常用的地图SDK:高德地图使用的是GCJ-02(也就是火星坐标系),百度使用的是BD-09百度坐标系 ...

  6. 【百度地图API】如何根据摩卡托坐标进行POI查询，和计算两点距离

    原文:[百度地图API]如何根据摩卡托坐标进行POI查询,和计算两点距离 摘要: 百度地图API有两种坐标系,一种是百度经纬度,一种是摩卡托坐标系.在本章你将学会: 1.如何相互转换这两种坐标: 2. ...

  7. iOS 之地图坐标体系和转换

    一.坐标体系 首先我们要明白,开发者能接触到哪些坐标体系呢? 第一种分类: 1. GPS,WGS-84,原始坐标体系.一般用国际标准的GPS记录仪记录下来的坐标, 都是GPS的坐标.很可惜,在中国,任 ...

  8. 百度地图API二：根据标注点坐标范围计算显示缩放级别zoom自适应显示地图

    原文:百度地图API二:根据标注点坐标范围计算显示缩放级别zoom自适应显示地图 版权声明:本文为博主原创文章,转载请注明出处. https://blog.csdn.net/liusaint1992/ ...

  9. php 百度地图 腾讯地图 转换坐标

    /* * 中国正常GCJ02坐标---->百度地图BD09坐标 * 腾讯地图用的也是GCJ02坐标 * @param double $lat 纬度 * @param double $lng 经度 ...

随机推荐

  1. TikaEntityProcessor 各种示例

    1. <dataConfig> <dataSource type="BinFileDataSource" /> <script><![CD ...

  2. Android 高级UI设计笔记22：Android 指示引导页（带圆点）

    1. 引导页: 我们在安装某个软件首次运行时,大部分都会有一个引导页的提示,介绍软件新功能的加入或者使用说明等,支持滑动且下面会有几个圆点,显示共有多少页和当前图片的位置,类似如下效果: 2. 引导页 ...

  3. 【阿里云产品公测】云引擎ACE新手实战基于Wordpress

    [阿里云产品公测]云引擎ACE新手实战基于Wordpress 作者:阿里云用户imnpc ACE(Aliyun Cloud Engine) 是一款弹性.分布式的应用托管环境,支持Java.php多种语 ...

  4. 读取Excel文件的两种方法

    第一种方法:传统方法,采用OleDB读取EXCEL文件, 优点:写法简单,缺点:服务器必须安有此组件才能用,不推荐使用 private DataSet GetConnect_DataSet2(stri ...

  5. iOS - UI - UIScrollView

    1.UIScrollView 滚动视图 // 滚动视图 UIScrollView* scrollView = [[UIScrollView alloc]initWithFrame:self.view. ...

  6. 如何鉴别程序抄袭c语言程序代写

    如何鉴别程序抄袭:如何鉴别一份程序代码是抄袭另一份程序.输入:两个C语言源程序文件 输出:抄袭了多少?给出最相似的片段,判断是谁抄袭了谁? 提示:首先进行统一规范化排版,去掉无谓的空格.空行,然后比对 ...

  7. ASUS K751笔记本电脑使用U盘启动

    ASUS K751笔记本电脑缺省是不能使用U盘启动的.即使开机按ESC键出现启动设备选项菜单,选择了U盘也一样会从硬盘启动. 为此需进行如下步骤: 开机按F2进入bios如下设置: Security- ...

  8. [转]c# xml.Load() locking file on disk causing errors

    本文转自:http://stackoverflow.com/questions/1812598/c-sharp-xml-load-locking-file-on-disk-causing-errors ...

  9. Oracl用代码建标

    建标还可以通过编写代码的方式实现,这样在建许多类似的表的时候可以极高建表的效率. create table SCORE                   --建立表名(                ...

  10. P2022 有趣的数

    P2022 有趣的数 题目描述 让我们来考虑1到N的正整数集合.让我们把集合中的元素按照字典序排列,例如当N=11时,其顺序应该为:1,10,11,2,3,4,5,6,7,8,9. 定义K在N个数中的 ...