HTML5 Geolocation API, html5geolocation

HTML5 Geolocation API, html5geolocation

HTML5 geolocation API technology (geographic location technology), where applications request users to share locations and provide location-related information, or build applications that use computing walking distance, enable the record function during exercise and social network applications based on GPS navigation. Currently, Geolocation APIs have two types of locating request functions:Single locationRequests and repetitiveLocation updateRequest.

 

Before accessing the location information, the browser will ask the user whether to share the location information. For example, if you allow the Chrome browser to share your location with the website, the Chrome browser willGoogle location service sends local network informationTo estimate your location. Then, the browser will share your location with the website requesting your location.

The returned location information is provided to the browser through the underlying device (laptop or mobile phone) that supports the HTML5 geographic location function. Location Information consists of longitude and latitude and other metadata (depending on the hardware device where the browser is located, including the handle, travel direction, and speed). With this information, you can build a Location Awareness application.

The longitude and latitude coordinates can be in decimal (39.1722) or DMS (angle, 39 ° 10' 20 ") format.

 

Where does location information come from?

The Geolocation API does not guarantee the accuracy of the data returned by the device. The device can use the following data sources:

IP address and 3D coordinates (GPS Global Positioning System, WiFi MAC address, GSM or CDMA mobile phone ID and user-defined data)

IP addressIf the user's IP address is provided by the ISP, its location is usually determined by the physical address of the service provider, which is inaccurate and the computing cost on the server side is high.

GPS location dataThe mobile phone provides signals from multiple GPS satellites around the Earth to provide very accurate positioning results. However, the positioning time is long and is not suitable for applications that require rapid response.

Wi-Fi location dataThe distance from the user's current location to multiple known Wi-Fi access points is obtained through Triangle calculation. It can be used indoors and is simple and fast.

Mobile phone location dataIt is determined by the triangular distance from the user to some base stations. It is usually used based on the geographical location information of WIFI and GPS.

Note: An application cannot directly access the device. It can only request a browser to access the device.

 

Browser support check

When the browser does not support this function, you can provide alternative text to remind users to upgrade the browser or install plug-ins to enhance the existing browser functions:

    (function loadDemo(){        if(navigator.geolocation){            document.getElementById("support").innerHTML = "geolocation support";        }else{            document.getElementById("support").innerHTML = "geolocation not supporet";        }    })();

Coordinates also have some features, which cannot be guaranteed to be supported by browsers, but if not, null is returned (for example, if you use a laptop, in this case, the user location cannot be accessed, and the height of altitude, traveling direction heading, and ground speed are also set)

 

Demo

Window. onload = function () {var options = {enableHighAccuracy: true, maximunAge: 1000, timeout: 45000}; if (window. navigator. geolocation) {navigator. geolocation. getCurrentPosition (successCallback, errorCallback, options);} else {alert ("your browser does not support location! ") ;}} Function successCallback (position) {var output =" "; output + =" Your position has bean located. \ r \ n "; output + =" Latitude: "+ position. coords. latitude + ""; output + = "longdistance:" + position. coords. longpolling + ""; output + = "Accuracy:" + position. coords. accuracy + "meters"; if (position. coords. latitude) {output + = "Accuracy:" + position. coords. altitudeAccuracy + "meters";} if (position. coords. heading) {output + = "Heading:" + position. coords. heading + "meters";} if (position. coords. speed) {output + = "Speed:" + position. coords. speed + "m/s";} output + = "Time of Position" + position. timestamp + "m/s"; alert (output );}

Function errorCallback (error) {switch (error. code) {case error. PERMISSION_DENIED: alert ("you have denied access to your position. "); break; case error. POSITION_UNAVAILABLE: alert ("there was a problem getting yout position. "); break; case error. TIMEOUT: alert ("The application has timed out attempting to get your location. "); break ;}}

The Geolocation API exists in the navigator object and contains only three methods:
1. getCurrentPosition
2. watchPosition
3. clearWatch

 

Call of core functions

navigator.geolocation.getCurrentPosition(successCallback,errorCallback,options);

SuccessCallbackThe function that should be called when specifying the available location data, because operations such as obtaining location data may take a long time to complete. No user wants the browser to be locked when searching the location, and no developer wants their programs to be suspended indefinitely. SuccessCallback is the place where the actual location information is received and processed.

ErrorCallbackLocation Information requests may fail due to some uncontrollable factors. The parameters are optional, but we recommend that you use them. Provides a function for explaining to users or prompting them to try again.

OptionsYou can adjust the data collection method of the html5 geolocation service.

Option

EnableHighAccuracy: notifies the browser to enable the html5 service high-precision mode maximunAge: indicates the time interval for the browser to re-calculate the location, in ms. The default value is ns, the location of each request must be calculated immediately. Timeout: indicates the maximum time allowed by the browser to calculate the current position. If the calculation is not completed after this time, the error handler is called. The default value is infinity.

 

For error numbers

PERMISSION_DENIED.

The coords attribute has seven values, including the latitude and longitude used above.

1. accuracy of accuracy
2. altitude
3. Accuracy of altitudeAcuracy altitude
4. heading
5. speed the ground speed

 

Integrate Baidu map with HTML5 Geolocation API

1 <! Doctype html> 2