<!DOCTYPE html>

<html lang="en">

<head>

    <title>地理定位</title>

    <meta charset="utf-8">

    <style>

        body, html,#map {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}

    </style>

    <script type="text/javascript"

            src="http://api.map.baidu.com/api?v=2.0&ak=rdDa3ErxDVOjn9LPD4ocvp08sFG0u1BV">

    </script>

</head>

<body>

<script>

    function success(position ) {

       var la=position.coords.latitude;

         var lo=position.coords.longitude;

        var map = new BMap.Map("map");    // 创建Map实例

        map.centerAndZoom(new BMap.Point(lo, la), 15);  // 初始化地图,设置中心点坐标和地图级别

        map.addControl(new BMap.MapTypeControl());   //添加地图类型控件

        map.setCurrentCity("广州 ");          // 设置地图显示的城市 此项是必须设置的

        map.enableScrollWheelZoom(true);

    }

    function error() {

            alert("不能获取");

    }

    var options={};

    if(navigator.geolocation) {

        navigator.geolocation.getCurrentPosition(success,error,options);

    } else {

        alert("你的浏览器不支持");

    }

</script>

<div id="map"></div>

</body>

</html>

　　2017-09-12  20:14:22

HTML 地理定位 的实例的更多相关文章

  1. HTML5学习笔记 Geolocation（地理定位）

    HTML5 Geolocation(地理定位)用于定位用户的位置. 定位用户的位置 html5 Geolocation API用于获得用户的地理位置 鉴于该特性可能低侵犯用户的隐私,除非用户同意,否则 ...

  2. HTML5调用百度地图API进行地理定位实例

    自从HTML5的标准确定以后,越来越多的网站使用HTML5来进行开发.虽然对HTML5支持的浏览器不是很多,但是依然抵挡不了大伙对HTML5开发的热情.今天为大家带来的是使用HTML5调用百度地图AP ...

  3. HTML5学习总结-03 地理定位

    一 地理定位 HTML5 Geolocation(地理定位)用于定位用户的位置. 1 地理定位 地理位置 经度  :   南北极的连接线 纬度  :   东西连接的线 位置信息从何而来: IP地址 G ...

  4. 用HTML5、地理定位API和Web服务来开发移动应用

    HTML 5 是一项让人振奋的技术,这有着充分的理由.这将会是一次技术突破,因为它可以将桌面应用程序功能带入浏览器中.除了传统浏览器外,对于移动浏览器,其潜力甚至更大.不仅如此,最流行的移动浏览器甚至 ...

  5. HTML5 总结-地理定位-6

    HTML5 地理定位 定位用户的位置 HTML5 Geolocation API 用于获得用户的地理位置. 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. 浏览器支持 Int ...

  6. 小强的HTML5移动开发之路（18）——HTML5地理定位

    来自:http://blog.csdn.net/dawanganban/article/details/18192091 在前面的<小强的HTML5移动开发之路(2)--HTML5的新特性> ...

  7. HTML5 — 地理定位

    Geolocation:地理定位,获取当前浏览器所在的地理坐标信息(包括经度.纬度.海拔高度.移动速度),实现LBS应用(Location Based Service)——基于定位的服务,如订   餐 ...

  8. HTML5 Geolocation API地理定位整理（二）

    Geolocation 实例demo 1.使用watchPosition()监听客户端位置 var watchOne=null; if (navigator.geolocation) { //watc ...

  9. HTML5 Geolocation API地理定位整理（一）

    HTML5 Geolocation API 用于获得用户的地理位置. 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. 浏览器支持 Internet Explorer 9+, ...

随机推荐

  1. NOIp 数据结构专题总结 (1)：STL、堆、并查集、ST表、Hash表

    系列索引: NOIp 数据结构专题总结 (1) NOIp 数据结构专题总结 (2) STL structure STL 在 OI 中的运用:https://oi.men.ci/stl-in-oi/ s ...

  2. 基于ES6的tinyJquery

    原文地址:Bougie的博客 jQuery作为曾经Web前端的必备利器,随着MVVM框架的兴起,如今已稍显没落.但它操作DOM的便利性无出其右.我用ES6写了一个基于class简化版的jQuery,包 ...

  3. apache主要配置详解

    1. # Deny access to the entirety of your server's filesystem. You must # explicitly permit access to ...

  4. php面试专题---20、MySQL的安全性考点

    php面试专题---20.MySQL的安全性考点 一.总结 一句话总结: 还是得多看视频,教程看的浮光掠影,容易get不到重点:比如预处理防sql注入之前是挺熟,后面就忘记了,而且看文章get不到点 ...

  5. 生产环境下，oracle不同用户间的数据迁移。第二部分

    任务名称:生产环境下schema ELON数据迁移至schema TIAN######################################## 测试二:测试参数remap_tablespa ...

  6. p4111 [HEOI2015]小Z的房间[简述矩阵树定理]

    分析 [1]无向图 图G的度数矩阵为D,邻接矩阵为A 我们定义这个图的Kirchhoff矩阵为D-A 这个矩阵的任意一个n-1阶主子式的行列式的绝对值就是这个图的生成树个数 [2]有向图 如果要求内向 ...

  7. 为什么从pycharm中打开的html文件会显示404?

    问题如图: 解决办法: 某次发现运行导入的html文件的时候,打开浏览器会报404错误:而运行自己写的html文件则正常显示:最后发现这是pycharm缓存问题,只需重启pycharm清除缓存就ok啦 ...

  8. day10—jQuery初步实践，关于菜单

    转行学开发,代码100天——2018-03-26 今天是本人写开发记录方面博客的第10天了,不知不觉已经涉及到jQuery框架的学习了. 第一次熬夜写前端代码还是两年前,不过中途放弃了,学的东西也日渐 ...

  9. Vagrant 手册之 Multi-machine 多机器

    原文地址 Vagrant 可以在一个 Vagrantfile 中定义并控制多个虚拟机.这就是"multi-machine"环境. 这些机器可以协同工作或互相关联.multi-mac ...

  10. Pollard Rho算法浅谈

    Pollard Rho介绍 Pollard Rho算法是Pollard[1]在1975年[2]发明的一种将大整数因数分解的算法 其中Pollard来源于发明者Pollard的姓,Rho则来自内部伪随机 ...