HTML5 地理位置定位API(3)
HTML5 地理位置定位实例
这篇文章主要为大家介绍了HTML5地理定位的方法,实例讲述了html5获取坐标完整实现过程,
并对比不同浏览器运行效果给出参考结果,需要的朋友可以参考下
本文实例讲述了html5获取地理定位的方法,分享给大家供大家参考。具体方法如下:
html5 获取坐标代码如下:
代码如下:
<html>
<head>
<title>test1.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<div id="demo">点击这个按钮,获得您的坐标:</div>
<button onclick="getLocation()">试一下</button>
<script type="text/javascript">
var x=document.getElementById("demo");
function getLocation(){
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(showPosition);
}else{
x.innerHTML="浏览器不支持!!!";
}
}
function showPosition(position){
x.innerHTML="Latitude: "+position.coords.latitude+"<br/>Longitude: "+position.coords.longitude;
}
</script>
</body>
</html>
经测试,在IE9 、firefox、chrome、opera上都可以成功获取到坐标位置,但是safari 5.x上却不能返回坐标,暂时木有找到原因。成功的案例里头,chrome响应的速度最快,其次是opera,然后是IE9,firefox居然是最慢 的。个人表示对firefox很失望,不过chrome倒是越来棒了。
希望本文所述对大家的HTML5程序设计有所帮助。
HTML5 地理位置定位API(3)的更多相关文章
- HTML5 地理位置定位API(1)
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- HTML5 地理位置定位API(5)
HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Intern ...
- HTML5 地理位置定位API(2)
HTML5 Geolocation API (地理位置应用程序接口) 目前PC浏览器支持情况: Firefox 3.5+Chrome 5.0+Safari 5.0+Opera 10.60+Intern ...
- HTML5 地理位置定位API(4)
地理定位(geolocation)是最令人兴奋,而且得到了广泛支持的一个新API.通过这套API, JavaScript代码能够访问到用户的 当前位置信息.当然,访问之前必须得到用户的明确许可,即同意 ...
- HTML5 地理位置定位(HTML5 Geolocation)原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- [Javascript] HTML5 地理位置定位(HTML5 Geolocation)原理及应用
地理位置(Geolocation)是 HTML5 的重要特性之一,提供了确定用户位置的功能,借助这个特性能够开发基于位置信息的应用.今天这篇文章向大家介绍一下 HTML5 地理位置定位的基本原理及各个 ...
- 使用HTML5地理位置定位到城市的方法及注意事项
介绍 本文将简述一下如何通过HTML5和百度地图开放平台提供的API来实现对浏览器的定位.实现效果为显示出用户所在的省市,即: XXX省 XXX市. 实现思路 利用HTML5 提供的API获取到用户的 ...
- html5地理位置定位功能小析
Geolocationd 基本原理1.GPS GPS基本原理是测量出已知位置的卫星到用户接收机之间的距离,然后综合多颗卫星的数据就可知道接收机的具体位置.适用于具备GPS功能的设备(1)优点:在 ...
- HTML5地理定位API在chrome中不能正常使用
navigator.geolocation.getCurrentPosition在chrome中不能正常使用. 经测试发现,FQ后就能正常使用,估计是因为chrome 对这个API的实现使用了goog ...
随机推荐
- jupyter notebook new Python3报错:Permission denied: Untitled.ipynb,修改workspace
点击新建Python文件即弹出弹窗显示 Permission denied: Untitled.ipynb 看到Permission denied 尝试是权限问题进行解决,各种百度结果都是对文件进行权 ...
- MyBatis3_[tp-26-27]_映射文件_select_返回List_记录封装Map:返回单个元素的Map或者整体Map集合
笔记要点出错分析与总结工程组织 1.定义接口 public interface EmployeeMapper { //多条记录封装到一个map中: Map<Integer,Employee> ...
- Hibernate初探之单表映射——jar包的导入
编写第一个Hibernate例子需要的基本步骤 创建Hibernate的配置文件 创建持久化类 创建对象-关系映射文件 通过Hibernate API编写访问数据库的代码 使用版本:Hibernate ...
- numpy 参考:https://mp.weixin.qq.com/s?__biz=MzU1MjYzNjQwOQ==&mid=2247486010&idx=1&sn=e42e6706e0e285ecbfdbbd76fb4ff352&chksm=fbfe50accc89d9ba56a3167c519638f1327a5c5bf12ed59dd8c6de9b2c25baeec1f1f8ad5fb7&
a=np.array([,,,]) b=np.arange() print(a,b) [ ] [ ] 对应相乘 c2=a*b [ 0 2 6 12] 对应相乘再求和 c3=a.dot( ...
- C++重温历史
这是一篇C#开发重新学习C++的体验文章. 作为一个C#开发为什么要重新学习C++呢?因为在C#在很多业务场景需要调用一些C++编写的COM组件,如果不了解C++,那么,很容易注定是要被C++同事忽悠 ...
- czy的后宫——矩阵快速幂优化DP
题意 有 n 个位置排成一行,可以放 m 种妹子.每个位置可以放也可以不放,规定某些妹子不能相邻,求方案数. 分析 #include<bits/stdc++.h> using namesp ...
- @select注解中可以用条件构造器
https://mp.baomidou.com/guide/wrapper.html#lambda https://blog.csdn.net/weixin_42236404/article/deta ...
- Mongodb 查询优化(慢查询Profiling)
开启慢查询Profiling Profiling级别说明 0:关闭,不收集任何数据. 1:收集慢查询数据,默认是100毫秒. 2:收集所有数据 1.通过修改配置文件开启Profiling 修改启动mo ...
- NetworkX系列教程(4)-设置graph的信息
小书匠Graph图论 要画出美观的graph,需要对graph里面的节点,边,节点的布局都要进行设置,具体可以看官方文档:Adding attributes to graphs, nodes, and ...
- Sprite Atlas与Sprite Mask详解
https://www.sohu.com/a/169409304_280780 Unity 2017.1正式发布后,带来了一批能帮助大家更加简化工作流的新功能.今天这篇文章,将由Unity技术经理成亮 ...