Heim > Web-Frontend > H5-Tutorial > html5 navigator.geolocation ruft den geografischen Standortcode basierend auf dem Browser ab

html5 navigator.geolocation ruft den geografischen Standortcode basierend auf dem Browser ab

黄舟
Freigeben: 2017-04-01 11:15:10
Original
3490 Leute haben es durchsucht

1. Einführung

html5 stellt das Geolokalisierungs--Attribut für window.navigator bereit, das verwendet wird, um die aktuelle Benutzergeografie abzurufen am Standort des Browsers.

window.navigator.geolocation bietet 3 Methoden:

void getCurrentPosition(onSuccess,onError,options);
//获取用户当前位置

int watchCurrentPosition(onSuccess,onError,options);
//持续获取当前用户位置

void clearWatch(watchId);
//watchId 为watchCurrentPosition返回的值
//取消监控


options = {
     enableHighAccuracy,//boolean 是否要求高精度的地理信息
     timeout,//获取信息的超时限制
     maximumAge//对地理信息进行缓存的时间
}
//options可以不写,为默认即可
Nach dem Login kopieren

2. Position Objekt

Wenn die geografischen Standortinformationen erfolgreich abgerufen wurden Gleichzeitig wird das Positionsobjekt in der onsuccess-Methode zurückgegeben. Über dieses Objekt können Sie relevante Informationen zum geografischen Standort erhalten, einschließlich:

position对象的属性:
 
latitude,//纬度

longitude,//经度

altitude,//海拔高度

accuracy,//获取纬度或者经度的精度

altitudeAccurancy,//海拔高度的精度

heading,//设备前景方向。正北方向的顺时针旋转角

speed,//设备的前进速度 m/s

timestamp,//获取地理位置信息时候的时间
Nach dem Login kopieren

3. Beispiel basierend auf Google map

Schauen Sie sich den Code direkt an:

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <title>在页面上使用google地图示例</title>
</head>
<body onload = &#39;init()&#39;>
    <div id="map" style=&#39;width:800px;height:800px;&#39;></div>
    <script type="text/javascript" src=&#39;http://maps.google.com/maps/api/js?sensor=false&#39;></script>
    <script type="text/javascript">
        function init(){
            if(navigator.geolocation){
                navigator.geolocation.getCurrentPosition(function(pos){
                        var coords = pos.coords;
                        var latlng =new google.maps.LatLng(coords.latitude,coords.longitude);
                        var options = {zoom:14,center:latlng,mapTypeId : google.maps.MapTypeId.ROADMAP};
                        var map1;
                        map1 =new google.maps.Map(document.getElementById(&#39;map&#39;),options);
                        var marker =new google.maps.Marker({
                                position : latlng,
                                map : map1
                                });
                        var infowindow =new google.maps.InfoWindow({
                               content : &#39;当前位置!&#39;
                               });
                        infowindow.open(map1,marker);
                        });
            }
        }
    </script>
    
</body>
</html>
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonhtml5 navigator.geolocation ruft den geografischen Standortcode basierend auf dem Browser ab. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage