Geographical location of html5
1) use geographic positioning:
Access the location through navigator. geolocation and return a Geolocation object;
1.1) Geolocation object member:
GetCurrentPosition (callback, errorCallback, options) -- get the current position;
WatchPosition (callback, error, options) -- start to monitor the current position;
ClearWatch (id) -- Stop monitoring the current location;
1.1.1) when the browser calls the callback function parameter of getCurrentPosition, it will pass in a position object that provides location details;
Position object member:
Coords -- returns the Coordinates of the current position, that is, the Coordinates object;
Timestamp -- returns the time when the coordinate information is obtained;
Coordinates object member:
Latitude -- returns the latitude in decimal format;
Longpolling -- returns the longitude in decimal format;
Altitude -- returns the altitude in meters;
Accuracy -- returns the coordinate precision represented by meters;
AltitudeAccuracy -- returns the elevation precision in meters;
Heading -- return the travel direction indicated by the cost;
Speed -- returns the travel speed expressed in meters/s;
2) handle geographic location errors:
The second parameter of the getCurrentPosition (callback, errorCallback, options) method, which allows us to specify a function and call it when an error occurs in the obtained position. This function will get a PositionError object;
PositionError object member:
Code -- return code that represents the error type;
= 1 -- the user is not authorized to use the location function;
= 2 -- the location cannot be determined;
= 3 -- the request has timed out;
Message -- returns a string with an incorrect description;
3) specify the location options:
The third parameter provided by the getCurrentPosition (callback, errorCallback, options) method is a PositionOptions object.
PositionOptions object member:
EnableHighAccuracy -- tells the browser that we want to get the best possible results;
Timeout -- a time-out error is reported when the request location is limited;
MaximumAge-tell the browser where we are willing to accept the cache, as long as it is not earlier than the specified number of milliseconds;
4) Monitoring location:
The watchPosition method keeps updating the position. The required parameters are the same as those of the getCurrentPosition method and work in the same way.
The difference is that the callback function is called repeatedly as the position changes.
table{ border-collapse: collapse; } th,td{ padding: 4px; } th{ text-align: right; }
Longitude: |
- |
Latitude: |
- |
Altitude: |
- |
Coordinate precision: |
- |
Elevation precision: |
- |
Direction: |
- |
Speed: |
- |
Time: |
- |
Error Type: |
- |
Error Message |
- |
Cancel Watch
var options={ enableHighAccuracy:false, timeout:2000, maximumAge:30000 } var WatchID=navigator.geolocation.watchPosition(displayPosition,handleError,options) document.getElementById(pressme).onclick=function(e){ navigator.geolocation.clearWatch(WatchID); } function displayPosition(pos){ var properties=[longitude,latitude,altitude,accuracy,altitudeAccuracy,heading,speed]; for(var i=0;i