<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8"/>

    <title>基于浏览器的HTML5查找地理位置</title>

    <!-- 百度API -->

    <script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>

    <script>

//        void getCurrentPosition(onSuccess,onError,options);

        //获取用户当前位置

//        int watchCurrentPosition(onSuccess,onError,options);

        //持续获取当前用户位置

//        void clearWatch(watchId);

        //watchId 为watchCurrentPosition返回的值

        //取消监控

//options = {

//            enableHighAccuracy,　　　//boolean 是否要求高精度的地理信息

//            timeout,　　　　　　　　　//表示等待响应的最大时间，默认是0毫秒，表示无穷时间

//            maximumAge　　　　　　　　/应用程序的缓存时间

//}

　　　　function getLocation(){

            var options={

                enableHighAccuracy:true,

                maximumAge:1000

            }

            if(navigator.geolocation){

                //浏览器支持geolocation

                navigator.geolocation.getCurrentPosition(onSuccess,onError,options);

            }else{

                //浏览器不支持geolocation

            }

        }

        //成功时

        function onSuccess(position){

            //返回用户位置

            //经度

            var longitude =position.coords.longitude+0.008774687519; ;

            //纬度

            var latitude = position.coords.latitude+0.00374531687912;

            //使用百度地图API

            //创建地图实例

            var map =new BMap.Map("container");

            //创建一个坐标

            var point =new BMap.Point(longitude,latitude);

            //地图初始化，设置中心点坐标和地图级别

            map.centerAndZoom(point,15);

            map.enableScrollWheelZoom(true);

            var marker = new BMap.Marker(point);  // 创建标注

            map.addOverlay(marker);               // 将标注添加到地图中

        }

        //失败时

        function onError(error){

            switch(error.code){

                case 1:

                    alert("位置服务被拒绝");

                    break;

                case 2:

                    alert("暂时获取不到位置信息");

                    break;

                case 3:

                    alert("获取信息超时");

                    break;

                case 4:

                    alert("未知错误");

                    break;

            }

        }

        window.onload=getLocation;

    </script>

</head>

<body>

<div id="container" style="width:600px;height:600px"></div>

</body>

</html>

关于html5获取用户地理位置的更多相关文章

  1. 根据ip获取用户地理位置

    各大网站都提供根据ip获取用户地理位置信息,这里以新浪的接口为例子 接口地址为:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js ...

  2. 【微信小程序】获取用户地理位置权限，二次请求授权，逆解析获取地址

    摘要:微信小程序内获取用户地理位置信息授权,被拒绝后二次获取,获取权限后逆解析得到用户所在省市区等.. 场景:商城类小程序,在首页时需展示附近门店,即用户刚进入小程序时就需要获取到用户位置信息 ste ...

  3. JSSDK获取用户地理位置信息

    复制一份JSSDK环境,创建一份index.html文件,结构如图7.1所示. 图7.1  7.1节文件结构 在location.js中,封装“getLocation”接口,如下: 01  wxJSS ...

  4. 微信小程序--获取用户地理位置名称(无须用户授权)的方法

    准备 1.在http://lbs.qq.com/网站申请key 2.在微信小程序后台把apis.map.qq.com添加进request合法域名 效果 添加封装 /** * 发起网络请求 * @par ...

  5. 用户Ip地址和百度地图api接口获取用户地理位置（经纬度坐标，城市）

    <?php   //获取用户ip(外网ip 服务器上可以获取用户外网Ip 本机ip地址只能获取127.0.0.1) function getip(){     if(!empty($_SERVE ...

  6. html5获取用户当前的地理位置，即经纬度。

    $("document").ready(function(){ getMap(); }); function getMap(){ // 百度地图API功能 var map = ne ...

  7. php,微信公众号,获取用户地理位置 定位 经纬度

    <?php //php插件下载地址: https://files.cnblogs.com/files/fan-bk/jssdk_php.rar //建立一个php文件 require_once ...

  8. html5获取用户当前位置

    支持地理定位的浏览器有IE9+.Firefox 3.5+ .Opera 10.6+ .Safari 5+ .Chrome.iOS 版Safari.Android版WebKit. navigator.g ...

  9. [微信开发] 微信JSAPI - 获取用户地理位置信息

    参考博客 http://blog.csdn.net/u013142781/article/details/50503299 主要JS 方法 wx.getLocation 获取地理位置信息传递参数 成功 ...

随机推荐

  1. Highmaps网页图表教程之图表配置项结构与商业授权

    Highmaps网页图表教程之图表配置项结构与商业授权 Highmaps图表配置项结构 Highmaps最核心的部分就是图表配置项.用户通过图表配置项来对标题进行定制,从而实现自己所要的效果.所以,掌 ...

  2. Python进阶篇：文件系统的操作

    通过一个例子来熟悉文件的基本操作:创建文件,读取文件,修改文件,删除文件,重命名文件,判断文件是否存在 ''' 编写可供查询的员工信息表--学号 姓名 年龄 班级 1. 提供格式化查询接口 2. 允许 ...

  3. Python168的学习笔记7

    关于多线程操作. 对于IO操作,如访问网站,写入磁盘这种需要时间等待响应的操作,多个cpu也几乎不能提高效率. 对于CPU密集型操作,如这个格式转换,可以通过多个cpu同时去进行. 但是对于pytho ...

  4. thrift 安装 make 失败 ar: .libs/ThriftTest_constants.o: No such file or directory

    $wget http://mirrors.cnnic.cn/apache/thrift/0.9.1/thrift-0.9.1.tar.gz $tar zxvf thrift-0.9.1.tar.gz ...

  5. 极路由通过SSH添加静态路由表之后无法跳转的问题

    1.确定系统已经开启了转发功能: /etc/sysctl.conf下的配置项目为net.ipv4.ip_forward = 1 2.关闭防火墙的REJECT,也就是修改/etc/config/fire ...

  6. [Android] 字体使用dp单位避免设置系统字体大小对排版的影响

    [Android] 字体使用dp单位避免设置系统字体大小对排版的影响 以魄族mx3为例,在设置->显示->字体大小中能够选择字号大小例如以下图: 图1. 魄族mx3 会导致软件在有固定定高 ...

  7. WindowsPhone&amp;Windows8.1&amp;Windows8&amp;Unity3d 填坑日记

    近期的游戏开发大体上接近尾声,总结了不少关于Unity3d面向Windows几大平台开发时遇到的各种坑以及怎样填坑的经验.总的来说,Windows8.1 Windows8/RT以及WindowsPho ...

  8. sql server 游标continue，总是死循环

    也遇上过:   死循环是因为continue后又执行与上次相同的fetch了.在continue前加一个fetch next from就可以了.

  9. Thinkpad T440p安装Linux的种种问题（by quqi99)

    作者:张华  发表于:2014-05-08 版权声明:能够随意转载,转载时请务必以超链接形式标明文章原始出处和作者信息及本版权声明 (http://blog.csdn.net/quqi99 ) Thi ...

  10. CentOS7部署Nginx

    CentOS7部署Nginx 1.准备工作 Nginx的安装依赖于以下三个包,意思就是在安装Nginx之前首先必须安装一下的三个包,注意安装顺序如下: 1 SSL功能需要openssl库,直接通过yu ...