${i18n("header.title")}

cordova 获取地理位置

第一步，引入插件

cordova plugin add cordova-plugin-geolocation

第二步，

<!DOCTYPE html>
<html>
    <head>
        <title>Capture Photo</title>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
        <script type="text/javascript" charset="utf-8">
 
            document.addEventListener("deviceready",onDeviceReady,false);
 
            //Cordova加载完成会触发
            function onDeviceReady() {
            }
 
            function getCurrentPosition(){
                //定位数据获取成功响应
                var onSuccess = function(position) {
                    alert('纬度: '          + position.coords.latitude          + '\n' +
                          '经度: '         + position.coords.longitude         + '\n' +
                          '海拔: '          + position.coords.altitude          + '\n' +
                          '水平精度: '          + position.coords.accuracy          + '\n' +
                          '垂直精度: ' + position.coords.altitudeAccuracy  + '\n' +
                          '方向: '           + position.coords.heading           + '\n' +
                          '速度: '             + position.coords.speed             + '\n' +
                          '时间戳: '         + position.timestamp                + '\n');
                



　　　　　　　　　　};
 
                //定位数据获取失败响应
                function onError(error) {
                    alert('code: '    + error.code    + '\n' +
                          'message: ' + error.message + '\n');
                }
 
                //开始获取定位数据
                navigator.geolocation.getCurrentPosition(onSuccess, onError);
            }
        </script>
    </head>
    <body style="padding-top:50px">
        <button style="font-size:23px;" onclick="getCurrentPosition();">获取位置信息</button>
    </body>
</html>

这两步可以实现获取经纬度；

那么我们继续获取百度api实现地理位置文字获取；

我直接在上个hmlt添加好了

<!DOCTYPE html>
<html>
<head>
    <title>Capture Photo</title>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>

<!--这里是引入百度api的地方-->
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=5a21b9801cac081f6473bafdc558c53a"></script>
    <script type="text/javascript" charset="utf-8">

            document.addEventListener("deviceready",onDeviceReady,false);
            //Cordova加载完成会触发
            function onDeviceReady() {
            }
            function getCurrentPosition(){

                //定位数据获取成功响应
                var onSuccess = function(position) {
                    alert('纬度: '          + position.coords.latitude          + '\n' +
                          '经度: '         + position.coords.longitude         + '\n' +
                          '海拔: '          + position.coords.altitude          + '\n' +
                          '水平精度: '          + position.coords.accuracy          + '\n' +
                          '垂直精度: ' + position.coords.altitudeAccuracy  + '\n' +
                          '方向: '           + position.coords.heading           + '\n' +
                          '速度: '             + position.coords.speed             + '\n' +
                          '时间戳: '         + position.timestamp                + '\n');

                    // 百度地图API功能
                    var map = new BMap.Map("allmap");
                    alert("测试--"+map+"经度:"+position.coords.latitude+"纬度"+position.coords.longitude)
                    var point = new BMap.Point(position.coords.longitude,position.coords.latitude);//纬度,经度
                    alert("测试-point-")
                    var gc = new BMap.Geocoder();
                    alert("测试-gc-")
                    var pt = point;
                    gc.getLocation(pt, function(rs){
                        var addComp = rs.addressComponents;
                          alert("成功--")
                        alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " +
                        addComp.streetNumber);
                    });
                };
　　　　　　　　　　///////////////////////////////////////百度api结束///////////
                //定位数据获取失败响应
                function onError(error) {
                    alert('code: '    + error.code    + '\n' +
                          'message: ' + error.message + '\n');
                }

                //开始获取定位数据
                navigator.geolocation.getCurrentPosition(onSuccess, onError);

            }

    </script>
</head>
<body style="padding-top:50px">
<button style="font-size:23px;" onclick="getCurrentPosition();">获取位置信息</button>
</body>
</html>

 

posted @ 2017-04-19 19:24  ldp.im  阅读(4864)  评论(0)  编辑  收藏  举报