根据HTML5 获取当前位置的经纬度

是想让地图的定位用户位置更准确一些。

查看了介绍: http://www.w3school.com.cn/html5/html_5_geolocation.asp

看介绍中拿数据挺简单。

<!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>

正确点击按钮能拿到返回的经纬度

有个问题是:    navigator.geolocation.getCurrentPosition(showPosition);   这个回调,有时有,有时没有 ,不稳定。  还有就是出来的经纬度弄到地图上,我了个去,跑到广州了。。。

--------------------------------------

本身百度地图api

ip定位:   http://lbsyun.baidu.com/jsdemo.htm#i8_2 ,  有点糙,显示的是城市名

浏览器定位:  http://lbsyun.baidu.com/jsdemo.htm#i8_1   ,拿到经纬度展示,大概的。

百度有个 Geolocation, 打开上面的2个中一个,替换下<script>代码如下,执行下

<script type="text/javascript">
	// 百度地图API功能
	var map = new BMap.Map("allmap");
	var point = new BMap.Point(116.331398,39.897445);
	map.centerAndZoom(point,12);

	var geolocation = new BMap.Geolocation();  //实例化浏览器定位对象。
 //下面是getCurrentPosition方法。调用该对象的getCurrentPosition(),与HTML5不同的是,这个方法原型是getCurrentPosition(callback:function[, options: PositionOptions]),也就是说无论成功与否都执行回调函数1,第二个参数是关于位置的选项。 因此能否定位成功需要在回调函数1中自己判断。
geolocation.getCurrentPosition(function(r){   //定位结果对象会传递给r变量
    if(this.getStatus() == BMAP_STATUS_SUCCESS){  //通过Geolocation类的getStatus()可以判断是否成功定位。
        var mk = new BMap.Marker(r.point);    //基于定位的这个点的点位创建marker
        map.addOverlay(mk);    //将marker作为覆盖物添加到map地图上
        map.panTo(r.point);   //将地图中心点移动到定位的这个点位置。注意是r.point而不是r对象。
        alert(‘您的位置:‘+r.point.lng+‘,‘+r.point.lat);  //r对象的point属性也是一个对象,这个对象的lng属性表示经度,lat属性表示纬度。
    }
    else {
        alert(‘failed‘+this.getStatus());
    }
},{enableHighAccuracy: true})
</script>

  

得到的是大致的经纬度,但城市是对的,位置有些偏差。

时间: 2024-08-01 07:46:33

根据HTML5 获取当前位置的经纬度的相关文章

使用html5获取当前手机的经纬度,并接入百度地图API,查询出当前位置

最近项目需要,稍微研究一下html5获取当前地理位置的问题. 获取当前位置的经纬度很简单,一句代码就搞定 [javascript] view plain copy print? navigator.geolocation.getCurrentPosition(function (position) { longitude = position.coords.longitude; latitude = position.coords.latitude; });   然后查阅百度地图API,很eas

百度地图定位 : 获取当前位置的经纬度

说明: 1.初始化 BaiduMap SDK要在显示界面之前,即: SDKInitializer.initialize(Context); setContentView(R.layout.main); 2. 设置定位的模式是 LocationMode.Hight_Accuracy 时,在室内可能无法获取到准确的经纬度,会得到默认的值是4.9E-324 处理办法是将模式改为Battery_Saving,或到室外 3.可以根据当前设备网络连接情况和GPS是否开启来设定定位模式 //获得网络连接情况

UWP Windows10开发获取设备位置(经纬度)

1.首先要在UWP项目的Package.appxmanifest文件中配置位置权限,如下图所示: 2.Package.appxmanifest后选择第三个选项卡,勾选位置权限(Location) 打开 3.然后创建一个LocationManage类,包括以下代码: public async static Task<Geoposition> GetPosition() { //请求对位置的访问权 var accessStatus = await Geolocator.RequestAccessA

Uwp Windows10获取设备位置(经纬度)

先在Package.appxmanifest中配置位置权限 2. 创建LocationManager类 1 using System; 2 using System.Collections.Generic; 3 using System.Linq; 4 using System.Text; 5 using System.Threading.Tasks; 6 using Windows.Devices.Geolocation; 7 8 namespace Weather 9 { 10 public

Android实战--基于位置的服务(获取自己位置的经纬度+百度地图)

需要借助LocationManager类实现,下面直接看代码: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="

百度地图用ip获取当前位置的经纬度(高精度)

步骤比较简单先上百度地图API官网,申请一个应用AK(访问凭据):查看一下高进度定位的API,看看是否都符合要求下面直接上代码 /** * 根据ip获取地理坐标 * @param ip * @return */ public JSONObject getCoorsByIp(String ip){ if (null == ip) { ip = ""; } try { URL url = new URL("http://api.map.baidu.com/highacciploc

通过HTML5获取当前位置

// 当前位置 function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); } else { alert("暂时无法定位!"); } } function showPosition(position) { alert(position.coords.latitude + " " + position.coor

H5高德地图获取当前位置

<!doctype html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="initial-scale=1.0, user-scalable=no, wi

微信小程序-获取当前位置和城市名

微信小程序-获取当前城市位置 1, 获取当前地理位置,首先要拿到用户的授权wx.openSetting: 2,微信的getLocation接口,获取当前用户的地理位置(微信返回的是经纬度,速度等参数): 3,微信没有将经纬度直接转换为地理位置,借用腾讯位置服务中关于微信小程序的地理转换JS SDK 的API(返回信息中包括国家,省,市,区,经纬度等地理位置)步骤描述清楚以后,下面就开始按步骤操作了:(本文仅仅讲述如何获取用户地理位置的授权) 图示为获取用户地理位置授权弹窗 在用户首次进入某页面(