BAIDU

<!DOCTYPE html>

<html>

<body>

<p id="demo">点击这个按钮，获得您的坐标：</p>

<button onclick="getLocation()">试一下</button>

<script>

var x=document.getElementById("demo");

function getLocation()

  {

  if (navigator.geolocation)

    {

    navigator.geolocation.getCurrentPosition(showPosition);

    }

  else{x.innerHTML="Geolocation is not supported by this browser.";}

  }

function showPosition(position)

  {

  x.innerHTML="Latitude: " + position.coords.latitude +

  "<br />Longitude: " + position.coords.longitude;

  }

</script>

</body>

</html>

GOOGLE

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>GIS开发利用html5获取经纬度</title>

</head>

<body>

<span id="support">将以下的经纬度输入谷歌地图：</span>

<div id="show">

纬度：<span id="latitude"></span><br />

经度：<span id="longitude"></span><br />

经纬度准确度：<span id="accuracy"></span><br />

海拔：<span id="altitude"></span><br />

海拔高度的准确度：<span id="altitudeAcuracy"></span><br />

朝向：<span id="heading"></span><br />

速度：<span id="speed"></span>

</div>

<script type="text/javascript">

var doc = document,

    latitude = doc.getElementById('latitude'),

    longitude = doc.getElementById('longitude'),

    accuracy = doc.getElementById('accuracy'),

    altitude = doc.getElementById('altitude'),

	altitudeAcuracy = doc.getElementById('altitudeAcuracy'),

	heading = doc.getElementById('heading'),

	speed = doc.getElementById('speed'),

	support = doc.getElementById('support'),

    showDiv = doc.getElementById('show');

function lodeSupport(){

    if(navigator.geolocation){

        support.innerHTML = '将以下的经纬度输入谷歌地图(纬度 经度)查看自己位置：';

        showDiv.style.display = 'block';

        navigator.geolocation.getCurrentPosition(updataPosition,showError);

    }else{

        support.innerHTML = '对不起，浏览器不支持！

';

        showDiv.style.display = 'none';

    }

}

function updataPosition(position){

    var latitudeP = position.coords.latitude,

        longitudeP = position.coords.longitude,

        accuracyP = position.coords.accuracy,

		altitudeP = position.coords.altitude,

		altitudeAcuracyP = position.coords.altitudeAcuracy,

		headingP = position.coords.heading,

		speedP = position.coords.speed;

    latitude.innerHTML = latitudeP;

    longitude.innerHTML = longitudeP;

    accuracy.innerHTML = accuracyP;

	altitude.innerHTML = altitudeP;

	altitudeAcuracy.innerHTML = altitudeAcuracyP;

	heading.innerHTML = headingP;

	speed.innerHTML = speedP;

}

function showError(error)

{

  switch(error.code)

    {

    case error.PERMISSION_DENIED:

      showDiv.innerHTML="用户拒绝訪问地理位置"

      break;

    case error.POSITION_UNAVAILABLE:

      showDiv.innerHTML="地理位置信息无法获取"

      break;

    case error.TIMEOUT:

      showDiv.innerHTML="获取位置时间超时"

      break;

    case error.UNKNOWN_ERROR:

      showDiv.innerHTML="我擦，这是一个未知的错误"

      break;

    }

}

window.addEventListener('load', lodeSupport , true);

</script>

</body>

</html>

html5 返回当前地理位置的坐标点（经纬度）的更多相关文章

  1. Html5 Geolocation获取地理位置信息

    Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. ...

  2. AngularJS进阶(二十)HTML5实现获取地理位置信息并定位功能

    HTML5实现获取地理位置信息并定位功能 注:请点击此处进行充电! 前言 这篇文章主要介绍了HTML5实现获取地理位置信息并定位功能,本文讲解了原生HTML5.百度地图.谷歌地图等三种获取理位置信息并 ...

  3. html5实现获取地理位置信息并定位

    这里主要讲h5实现获取地理位置信息并定位功能,本文讲解了原生h5,百度地图,谷歌地图等三种获取地理信息并定位的方法,需要的朋友可以参考下: h5提供了地理位置功能(Geolocation API),能 ...

  4. Html5 Geolocation获取地理位置信息(转)

    Html5中提供了地理位置信息的API,通过浏览器来获取用户当前位置.基于此特性可以开发基于位置的服务应用.在获取地理位置信息前,首先浏览器都会向用户询问是否愿意共享其位置信息,待用户同意后才能使用. ...

  5. HTML5实现获取地理位置信息并定位功能

    HTML5提供了地理位置定位功能(Geolocation API),能确定用户位置,我们可以借助HTML5的该特性开发基于地理位置信息的应用.本文结合实例给大家分享如何使用HTML5,借助百度.谷歌地 ...

  6. html5代码,获取地理位置

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta htt ...

  7. ArcGIS Engine 下投影坐标和经纬度坐标的相互转换

    ArcGIS Engine 下投影坐标和经纬度坐标的相互转换 投影转经纬度 ); pPoint.Project(pSRF.CreateGeographicCoordinateSystem((int)e ...

  8. ArcEngine下投影坐标和经纬度坐标的相互转换

    jojojojo2002 原文 ArcEngine下投影坐标和经纬度坐标的相互转换 投影转经纬度 private IPoint PRJtoGCS( double x, double y) { IPoi ...

  9. HTML5基础扩展——地理位置、本地存储、缓存

    HTML5扩展,继上两篇博客,我们来看一下HTML5的一些扩展的功能,由于HTML5更多是为了兼容电脑浏览器,安卓浏览器,苹果浏览器更多浏览器,或者说为这些浏览器提供一个统一的标准.因此目前在手机上的 ...

随机推荐

  1. idea 换主题

    换背景 . 选中行变色

  2. Android 自动化测试

    Python +Android +uiautomator test  在init中定义的方法 uiautomator     该模块是android的一个python包装uiautomator测试框架 ...

  3. 基于jQuery鼠标点击弹出登陆框效果

    基于jQuery鼠标点击弹出登陆框效果.这是一款扁平样式风格的jQuery弹出层登陆框特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <input type=" ...

  4. Error: failure: repodata/repomd.xml from fedora: [Errno 256] No more mirrors to try.

    记录一个小问题,重新买的linux换yum源的时候一直提示: Error: failure: repodata/repomd.xml ] No more mirrors to try. 一直说那个XM ...

  5. C语言 · 求最大公约数

    算法提高 求最大公约数   时间限制:1.0s   内存限制:512.0MB      编写一函数gcd,求两个正整数的最大公约数. 样例输入: 5 15样例输出:5 样例输入: 7 2样例输出:1 ...

  6. WCF 几种错误

    1.错误  SOAP 的安全协商失败  SOAP Message=X.509 证书 CN=qq-PC 不在被信任的人的存储中. 将整数导入到配置文件指定的存储区中的受信任人. 2.从另一方收到未进行安 ...

  7. c# 利用反射清除事件

    控件的事件清除,除了-=,就只能依靠反射来执行了. /// <summary> /// 清除一个对象的某个事件所挂钩的delegate /// </summary> /// & ...

  8. Android开发，在Fragment中，隐藏或关闭软键盘（虚拟键盘）的方法

    网上可以搜到各种方法,实际测试中,我的开发用机中,仅仅下面这个方法有效,记录一下. //隐藏虚拟键盘      public static void HideKeyboard(View v)      ...

  9. CodeWarrior WarningC12056

    C12056:SP debug info incorrect because of optimization or inline assemble 该warning是代码最优化时(common cod ...

  10. pom.xml设置maven的编码方式

    <build> <defaultGoal>compile</defaultGoal> <plugins> <plugin> <grou ...