html页面：

<!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 type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=密钥"></script> 
    <title></title> 
</head> 
<body> 
    <p id="allmap"></p>
</body> 
</html>
 
JS部分：
<script type="text/javascript"> 
 
    var x = ""; 
    var y = ""; 
    var dizhi = ""; 
 
    function getLocation(){ 
        if (navigator.geolocation) { 
            navigator.geolocation.getCurrentPosition(showPosition,showError); 
        }else{ 
            alert("浏览器不支持地理定位。"); 
        } 
    } 
 
    function showPosition(position){ 
      
 
        y = position.coords.latitude;//纬度 
        x = position.coords.longitude;//经度 
           
 
        // 百度地图API功能 
        //GPS坐标 
        var x = 116.32715863448607; 
        var y = 39.990912172420714; 
        var ggPoint = new BMap.Point(x, y); 
           
        //地图初始化 
        var bm = new BMap.Map("allmap"); 
 
        bm.centerAndZoom(ggPoint, 15); 
        bm.addControl(new BMap.NavigationControl()); 
        bm.enableScrollWheelZoom();   //启用滚轮放大缩小，默认禁用 
        bm.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用 
        bm.addEventListener("tilesloaded", function () { });//地图加载完成 
 
        var gc = new BMap.Geocoder(); 
 
 
        bm.addEventListener("click", function (e) { 
               
            ggPoint = new BMap.Point(e.point.lng, e.point.lat); 
            gc.getLocation(ggPoint, function (rs) { 
                  
                var addComp = rs.addressComponents; 
                var mapAddress = addComp.province + addComp.city + addComp.district 
                + addComp.street + addComp.streetNumber; 
 
                dizhi = mapAddress; 
 
                if (confirm(dizhi)) { 
                    window.location.href = "succes.html" 
                } 
 
                var marker = new BMap.Marker(ggPoint); // 创建点 
                bm.addOverlay(marker); 
                var label = new BMap.Label("您选择的位置为"+dizhi, { offset: new BMap.Size(20, -10) }); 
                marker.setLabel(label); //添加百度label 
                bm.setCenter(ggPoint); 
            }); 
        }); 
           
              
          
 
        bm.addControl(new BMap.NavigationControl()); 
 
 
 
        //坐标转换完之后的回调函数 
        translateCallback = function (data) { 
            if (data.status === 0) { 
                var marker = new BMap.Marker(data.points[0]); 
                bm.addOverlay(marker); 
                marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画 
                //marker.enableDragging();//可拖拽 
                //var label = new BMap.Label("您所在的位置", { offset: new BMap.Size(20, -10) }); 
                //marker.setLabel(label); //添加百度label 
                //bm.setCenter(data.points[0]); 
 
                  
 
                //var a=BMap.Convertor(ggPoint, 0); 
 
 
                gc.getLocation(data.points[0], function (rs) { 
                    //alert(rs.sematic_description); 
 
                    var addComp = rs.addressComponents; 
                    var mapAddress = addComp.province + addComp.city + addComp.district 
                    + addComp.street + addComp.streetNumber; 
 
                    dizhi = mapAddress; 
 
                    confirm(dizhi); 
                    if (confirm(dizhi)) { 
                        window.location.href = "succes.html" 
                    } 
 
                    var label = new BMap.Label("定位您所在的位置为"+dizhi, { offset: new BMap.Size(20, -10) }); 
                    marker.setLabel(label); //添加百度label 
                    bm.setCenter(data.points[0]); 
 
                }); 
                                      
            } 
        } 
 
        setTimeout(function () { 
            var convertor = new BMap.Convertor(); 
            var pointArr = [] 
            pointArr.push(ggPoint); 
            convertor.translate(pointArr, 1, 5, translateCallback) 
        }, 1000); 
 
 
    } 
 
    function showError(error){ 
        switch(error.code) { 
            case error.PERMISSION_DENIED: 
                alert("定位失败,用户拒绝请求地理定位"); 
                break; 
            case error.POSITION_UNAVAILABLE: 
                alert("定位失败,位置信息是不可用"); 
                break; 
            case error.TIMEOUT: 
                alert("定位失败,请求获取用户位置超时"); 
                break; 
            case error.UNKNOWN_ERROR: 
                alert("定位失败,定位系统失效"); 
                break; 
        } 
    } 
 
    getLocation(); 
 
 
</script>

手机端GPS定位结合百度地图实现定位的更多相关文章

  1. 在Fragment中实现百度地图，定位到当前位置（基于SDKv2.1.0）

    使用最新版本的百度地图需要注意的几个地方: 1.libs文件夹下要有android-support-v4.jar.baidumapapi_v2_1_0.jar.locSDK_3.1.jar三个jar包 ...

  2. AngularJS进阶(十九)在AngularJS应用中集成百度地图实现定位功能

    在AngularJS应用中集成百度地图实现定位功能 注:请点击此处进行充电! 前言 根据项目需求,需要实现手机定位功能,考虑到百度业务的强大能力,遂决定使用百度地图第三方服务. 添加第三方模块的步骤与 ...

  3. Xamarin.Android 使用百度地图获取定位信息

    最近做一个项目,web端使用百度地图,PDA使用手持机自带的GPS定位系统获取经纬度,然后再百度地图上显示该经纬度会有一定距离的差异,这里就像可乐的瓶子拧上雪碧的盖子,能拧的上却不美观.所以为了数据的 ...

  4. 利用HTML5定位功能，实现在百度地图上定位（转）

    原文:利用HTML5定位功能,实现在百度地图上定位 代码如下: 测试浏览器:ie11定位成功率100%,Safari定位成功率97%,(add by zhj :在手机上测试(用微信内置浏览器打开),无 ...

  5. GPS坐标转换为百度地图坐标

    /** * GPS坐标转换为百度地图坐标 * 需要引入javabase64.jar 和json的一些包 * */ public class Gps2BaiDu { public static void ...

  6. GPS坐标转百度地图坐标

    百度地图提供了相关API:BMap.Convertor.translate, 但是使用上存在部分限制:1.次数限制:2.异步回调 可以用如下方法: /** * 地图位置计算工具(将GPS坐标转换成百度 ...

  7. ionic基于GPS定位并通过百度地图获取定位详细信息

    相信所有的前端攻城狮都会碰到移动端App.里面获取用户定位信息. 那么问题来了,怎么获取用户的定位信息(经纬度)呢. 当然方法有很多,通过百度地图API 以及 高德地图 API都是可以的.但是两个获取 ...

  8. Android 百度地图SDK 定位

    引用locSDK_6.1.3.jar,切记添加相应的so文件. 1.定位初始化,需要使用getApplicationContext() mLocClient = new LocationClient( ...

  9. Android应用中使用百度地图API定位自己的位置（二）

    官方文档:http://developer.baidu.com/map/sdkandev-6.htm#.E7.AE.80.E4.BB.8B3 百度地图SDK为开发人员们提供了例如以下类型的地图覆盖物: ...

随机推荐

  1. linux 文件检索操作

    linux命令太多了,作为一个后端开发人员,常用的也就这几个 uname -a 查看版本 tail tail -f /data/wealth-consignment-service/logs/stat ...

  2. NOIP系列

    NOIP2015运输计划 唉 真是 这题 卡死我了 tarjan离线lca复杂度O(n) 最后各种卡常,多交几遍才A(洛谷104ms) %%%zk学长609ms 注意二分的时候左边界要定成0 根据题意 ...

  3. PC蓝牙通信C#代码实现

    PC蓝牙通信C#代码实现 这篇文章主要为大家详细介绍了PC蓝牙通信C#代码实现,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 本文实例为大家分享了C#实现PC蓝牙通信代码,供大家参考,具体内容如下 ...

  4. Bigbluebutton服务执行过程及相关配置文件

    BigBlueButton服务列表 BigBlueButton由许多开源的服务组成,看似很麻烦,实际上拆分开每一个服务就很简单了,组件化平台化.究竟BBB都用到了哪些开源服务?我们来列举一下,名称均带 ...

  5. sql获取当前时间

    sql读取系统日期和时间的方法如下:--获取当前日期(如:yyyymmdd) select CONVERT (nvarchar(12),GETDATE(),112) --获取当前日期(如:yyyymm ...

  6. echarts.js中的图表大小自适应

    echarts的图表,如果父级容器的height/width属性设置为百分比的形式,那么echarts就会warning,且不能正常的生成图表.所以div容器的高度宽度必须指定为px,这设计不知道是为 ...

  7. eclipse好玩的插件集（一） CKEditor插件

    啥也不说,先上效果图: 当你输入完图片的url时,你可以得到预览的图像,从而进行宽高调整! 使用方法: 在eclipse市场中搜索ckeditor 配置操作如下:   进行文件关联,这样就可以直接用c ...

  8. redis.conf详细说明

    daemonize yes #---默认值no,该参数用于定制redis服务是否以守护模式运行.--- pidfile /var/run/redis.pid #默认值/var/run/redis.pi ...

  9. Jmeter-Java heap内存溢出

    使用jmeter进行压力测试时遇到一段时间后报内存溢出outfmenmory错误,导致jmeter卡死了,先尝试在jmeter.bat中增加了JVM_ARGS="-Xmx2048m -Xms ...

  10. UOJ#179. 线性规划[模板]

    传送门 http://uoj.ac/problem/179 震惊,博主竟然还不会线性规划! 单纯形实在学不会啊……背个板子当黑盒用…… 学(chao)了NanoApe dalao的板子 #includ ...