<!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. maven编译问题之 -The POM for XXX is invalid, transitive dependencies (if any) will not be available

    问题一: 把父工程tao-parent install 到maven本地仓后,接着install tao-common工程,然后报错 报错信息如下: [WARNING] The POM for com ...

  2. 如何分析及处理 Flink 反压？

    反压(backpressure)是实时计算应用开发中,特别是流式计算中,十分常见的问题.反压意味着数据管道中某个节点成为瓶颈,处理速率跟不上上游发送数据的速率,而需要对上游进行限速.由于实时计算应用通 ...

  3. 阿里云推出SRT+杜比全景声直播方案，低成本打造高质量直播观感体验

    超过200个国家和地区共5144万人观看:浙江卫视.东方卫视55城总收视达2.39,稳居同时段市场第一:优酷直播间63%观看晚会的用户参与了互动:微博68.2亿的主话题阅读量:2019天猫双11狂欢夜 ...

  4. 用树状数组写的最长上升子序列（友好城市），nlogn。

    #include<iostream> #include<algorithm> #define maxn 100000 #define lb(x) x&-x using ...

  5. 20180911-Java实例01

    Java 实例 – 如何编译 Java 文件 本文我们演示如何编译 HelloWorld.java 文件,其中 Java 代码如下: public class HelloWorld { public ...

  6. 各操作系统下php.ini文件的位置在哪里

    这个问题虽然说很小,但是却还是经常会出现的问题,特别是刚入门php的同学更是如此.而这个问题呢,我也经常被问到,所以就在这里总结一下. 首先php.ini文件并不是隐藏文件,寻找php.ini文件的方 ...

  7. OpenCV笔记：pyrDown()函数和pryUp()函数的使用

    OpenCV实现了用于创建图像金字塔的两个函数pyrDown()和pryUp(). 图像金字塔是一种经典的图像多尺寸描述方法,它将降采样和平滑滤波结合在一起,对图像进行多尺度表示.图像金字塔由不同尺寸 ...

  8. cannot be resolved to a type 错误解决方法

    引言:  eclipse新导入的项目经常可以看到“XX cannot be resolved to a type”的报错信息.本文将做以简单总结. 正文:      (1)jdk不匹配(或不存在)   ...

  9. windows10上使用一个tomcat部署2个项目

    前言:目前想在本机部署2个项目,网上查了之后,写下本篇随笔 1.准备工作 2.操作方法 3.运行2个项目 1.准备工作 2个war包(一个jprss.war和一个jenkins.war) 1个tomc ...

  10. LeetCode 112. Path Sum 动态演示

    给一个目标值,判断一棵树从根到叶子是否至少有一条路径加起来的和等于目标值 比较典型的深度优先算法. 引入一个全局变量bResult, 一旦找到一条,就不再搜索其他的了. class Solution ...