html获取当前的经纬度

html-css07

html获取当前的经纬度,第1张

网页获取用户位置信息的办法

1 调用百度地图的地图标注功能,通过百度地图API获取对应的经度和纬度进而获取地区信息

优点是比较准确,缺点是需要用户自己选择位置

2 通过H5 geolocation属性获取经度和纬度,优点是用户只需要点击允许获取即可,缺点是浏览器获取的经度相对不是很准确而且仍旧需要用户确认。

3 通过用户IP来分析用户位置

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8"/>

    <title>基于浏览器的HTML5查找地理位置</title>

    <!-- 百度API -->

    <script src="http://api.map.baidu.com/api?v=1.2" type="text/javascript"></script>

    <script>        function getLocation(){            var options={

                enableHighAccuracy:true,

                maximumAge:1000

            }            if(navigator.geolocation){                //浏览器支持geolocation                navigator.geolocation.getCurrentPosition(onSuccess,onError,options)

            }else{                //浏览器不支持geolocation

                alert('您的浏览器不支持地理位置定位')

            }

        }        //成功时

        function onSuccess(position){            //返回用户位置

            //经度

            var longitude =position.coords.longitude            //纬度

            var latitude = position.coords.latitude

            alert('经度'+longitude+',纬度'+latitude)            //根据经纬度获取地理位置,不太准确,获取城市区域还是可以的

            var map = new BMap.Map("allmap")            var point = new BMap.Point(longitude,latitude)            var gc = new BMap.Geocoder()

            gc.getLocation(point, function(rs){                var addComp = rs.addressComponents

                alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber)

            })

        }        //失败时

        function onError(error){            switch(error.code){                case 1:

                    alert("位置服务被拒绝")                    break                case 2:

                    alert("暂时获取不到位置信息")                    break                case 3:

                    alert("获取信息超时")                    break                case 4:

                    alert("未知错误")                    break

            }

        }

        window.onload=getLocation    </script>

</head>

<body>

</body>

</html>

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

1、检测是否支持地理定位

2、如果支持,则运行 getCurrentPosition() 方法。如果不支持,则向用户显示一段消息。

3、如果getCurrentPosition()运行成功,则向参数showPosition中规定的函数返回一个coordinates对象

4、showPosition() 函数获得并显示经度和纬度

希望对你有帮助,望采纳!