调用百度地图,选取坐标接口,并转换成GPS坐标

来源:互联网 发布:武汉华讯网络 编辑:程序博客网 时间:2024/06/04 19:32

调用百度地图,选取坐标接口,并转换成GPS坐标。

<!DOCTYPE html><html><head>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />    <style type="text/css">        body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}    </style>    <script src="http://code.jquery.com/jquery-latest.js"></script>    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=8579ee3b967425dc22f0c3953825ec95"></script>    <title>地址解析</title></head><body>分期名称:<input id="address" onKeyUp="keyup(event)"/><input type="button" value="获取一下" onclick="getLocalByAddr()"/>百度坐标:<input id="localtion" /><input type="button" value="复制到剪切板" onclick="copyToClipboard()"/>GPS坐标:<input id="gpsLocaltion" size="30"/>    <div id="allmap"></div></body></html><script type="text/javascript">    // 百度地图API功能    var map = new BMap.Map("allmap", {enableMapClick:false}); //关闭默认地图POI事件    var redPoint;    var g_point;    //滚轮缩放功能    map.enableScrollWheelZoom(true);    var point = new BMap.Point(116.331398,39.897445);    map.centerAndZoom(point,12);    // 创建地址解析器实例    var myGeo = new BMap.Geocoder();    // 将地址解析结果显示在地图上,并调整地图视野    getLocalByAddr();    //单击获取点击的经纬度    map.addEventListener("click",function(e){        //alert(e.point.lng + "," + e.point.lat);        writeLocalIntoInput(e.point);        map.removeOverlay(redPoint);        redPoint = new BMap.Marker(e.point);        map.addOverlay(redPoint);        g_point = e.point;        //var infoWindow = new BMap.InfoWindow(e.point.lat+','+e.point.lng, opts);  // 创建信息窗口对象         //map.openInfoWindow(infoWindow,e.point); //开启信息窗口    });    //根据地址获取坐标点信息,并将坐标点作为中心点    function getLocalByAddr(){        var address = document.getElementById("address").value;        console.log(address);        myGeo.getPoint(address, function(point){            writeLocalIntoInput(point);            if (point) {                map.centerAndZoom(point, 16);                map.removeOverlay(redPoint);                redPoint = new BMap.Marker(point);                map.addOverlay(redPoint);                g_point = point;                //var infoWindow = new BMap.InfoWindow(point.lat+','+point.lng, opts);  // 创建信息窗口对象                 //map.openInfoWindow(infoWindow,point); //开启信息窗口            }else{                alert("您选择地址没有解析到结果!");            }        }, "北京市");    }    //将坐标点写到框中    function writeLocalIntoInput(p){        if(p){            document.getElementById("localtion").value=p.lat+','+p.lng;            callGpsspg(p.lat+','+p.lng);        }else{            document.getElementById("localtion").value='';            document.getElementById("gpsLocaltion").value='';        }    }    //监听地址输入框的回车事件    function keyup(event){        if (event.keyCode == "13") {            //回车执行查询            getLocalByAddr();        }    }    //复制到剪切板    function copyToClipboard(){        var value = document.getElementById("localtion").value;        if(window.clipboardData){            window.clipboardData.setData("text", value);            alert(window.clipboardData.getData('text'))        }else{            alert("只支持IE");        }    }    var opts = {      width : 400,     // 信息窗口宽度      height: 60,     // 信息窗口高度      title : "" , // 信息窗口标题      enableMessage:true,//设置允许信息窗发送短息      message:""    }    /////////////////////////////////////////////////////////////////////////    //调用gpsspg网站,jsonp形式,确定,每日每个oid和key只有访问2000次    /*参数lat_lng 可以传递 lat或者lng中的一个*/function baiduToGPS(lat_lng){    var abs_lat_lng = Math.abs(lat_lng);   //a_  意为all,含有整数和小数部分。   //o_  意为only,只有小数部分   var du = parseInt(abs_lat_lng); //度(不含小数部分)   var o_du = lat_lng - du;   //度(只有小数部分)   var a_fen = o_du * 60;  //分(含有整数和小数部分)   var fen = parseInt(a_fen);  //分(不含小数部分)   var o_fen = a_fen - fen;  //分(只有小数部分)   var a_miao = o_fen * 60;   //秒(含有整数和小数部分)   var miao = a_miao.toFixed(2);      //秒(取两位小数)   var value = du + '°' + fen + '′' + miao + '″';   console.log(value);   return value;}//请求gpsspg网站的回调函数 function jsoncallback(data) {   console.log('转换状态:'+data.status);   //jsoncallback&&jsoncallback({"status":"200","result":[{"lat":30.99881860,"lng":108.69433701}],"match":[1]})   console.log('GPS坐标:'+data.result[0].lat+','+data.result[0].lng);   var lat = data.result[0].lat;   var lng = data.result[0].lng;   var lat_value = baiduToGPS(lat);   var lng_value = baiduToGPS(lng);   var gps = '';   if(lat >= 0){        gps = gps + '北纬N'+lat_value;   }else{        gps = gps + '南纬S'+lat_value;   }   gps = gps + ',';   if(lng >= 0){        gps = gps + '东经E'+lng_value;   }else{        gps = gps + '西经W'+lng_value;   }   console.log(gps);   //写到框中   document.getElementById("gpsLocaltion").value=gps;   var infoWindow = new BMap.InfoWindow('百度坐标:'+g_point.lat+','+g_point.lng+'<br/>'+'GPS坐标:'+gps, opts);  // 创建信息窗口对象    map.openInfoWindow(infoWindow,g_point); //开启信息窗口  } //第一种方式   getJSON形式 function callGpsspg(latAndLng){    $.getJSON("http://api.gpsspg.com/convert/latlng/?jsoncallback=?",      {        oid: "1905",        key: "A14DE785B8BB2FB60F684ED7E2CF0269",        from: "2",        to: "0",        //latlng: "31.0026777169,108.7051969740",        latlng: latAndLng,        output:"jsonp",        callback:"jsoncallback"      }      );  }  ///////////////////////////////////////////////////////////////</script>
0 0
原创粉丝点击