<!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. batchExportPNG.py不是我的代码

    #coding=gbk#@author lifc,20140806#批量制作输出专题图import arcpy,os,time,math #testpath=raw_input("testp ...

  2. JS一定要放在Body的最底部么？

    一.从一个面试题说起 面试前端的时候我喜欢问一些看上去是常识的问题.比如:为什么大家普遍把 <script src=""></script> 这样的代码放在 ...

  3. [转]div 让文字或图片居中

    本文转自:http://qsfwy.iteye.com/blog/250206 在div 中让 文字或图片居中,请参考以下代码1: - - - - - - - - - - - - - - - - - ...

  4. 剑指Offer02 替换空格

    /************************************************************************* > File Name: 02_Replac ...

  5. 微软测试版Visual Studio for Mac下载

    地址:https://www.visualstudio.com/thank-downloading-visual-studio-mac/?sku=vsmac#

  6. 转: 通过不到100行Go代码打造你自己的容器

    备注:这个文章讲容器,讲的比较的浅显易懂.推荐,前期入行者看. 转: http://www.infoq.com/cn/articles/build-a-container-golang?utm_sou ...

  7. 关于cornerstone无法上传library文件的问题

    在CornerStone中先选中左边的项目: 然后在菜单栏里面选择View->ShowIgnoreItems, 再选择项目中的library文件,点击Add按钮即可上传到服务器:

  8. asp.net MVC 如何隐藏 Response Header 版本号

    根据借楼最少资源原则,有时候MVC需要隐藏自己的版本号,其实这里也是比较简单的,只需要在Global.ascx 的Application_Start()中添加一行代码既可 添加为  MVCHandle ...

  9. SharePoint - 添加图片到Survey的某一问题之上

    Survey是SharePoint常用功能之一,而曾经被用户多次问到的问题是能否在Survey的某一问题上添加图片,经过查看,SharePoint Survey不提供此方法,只得谷歌之,得一比较懒但又 ...

  10. php-fpm参数调优

    关于php-fpm.conf参数调优,只对重要的参数进程调优.其它可参数前辈的. http://php.net/manual/zh/install.fpm.configuration.php (官方的 ...