11.37. HTML5 Geolocation

发布时间 : 2025-10-25 13:33:14 UTC      

Page Views: 9 views

HTML5 Geolocation is used to locate the location of the user.

11.37.1. Locate the location of the user

HTML5 Geolocation API is used to obtain the user’s geographic location.

In view of the fact that this feature may infringe upon the user’s privacy, the user location information is not available unless the user agrees.

11.37.2. Browser support

Internet Explorer Firefox Opera Google Chrome Safari

Internet Explorer 9, Firefox, Chrome, Safari and Opera support Geolocation .

Note: Geolocation is more accurate for devices with GPS, such as iPhone.

11.37.3. HTML5-use geolocation

Please use the getCurrentPosition() method to get the location of the user.

The following example is a simple geolocation example that returns the longitude and latitude of a user’s location:

Example

varx=document.getElementById("demo");functiongetLocation() {if(navigator.geolocation){navigator.geolocation.getCurrentPosition (showPosition);}else{x.innerHTML="This browser does not support obtaining geographic locations.";}} functionshowPosition(position){x.innerHTML="latitude:"+position.coords. latitude+"
longitude:"
+position.coords.longitude;}

Instance resolution:

  • Detect whether geolocation is supported

  • If supported, run getCurrentPosition() method. If not, a message is displayed to the user.

  • If getCurrentPosition() if it runs successfully, it returns a coordinates object

  • showPosition() function to obtain and display longitude and latitude

The above example is a very basic geolocation script with no error handling.

11.37.4. Handle errors and rejections

getCurrentPosition() the second parameter of the method is used to handle errors. It specifies the function to run when it fails to get the user’s location:

Example

functionshowError(error){switch(error.code) {caseerror.PERMISSION_DENIED:x.innerHTML= "The user refused the request to obtain the geographic location."break;caseerror.POSITION_UNAVAILABLE: x.innerHTML="Location information is not available."break;caseerror.TIMEOUT:x.innerHTML=" Request for user geographic location timeout."break;caseerror.UNKNOWN_ERROR:x.innerHTML="Unknown error."break;}} 

Error code:

  • Permission denied-users do not allow geolocation

  • Position unavailable-unable to get the current location

  • Timeout-Operation timed out

11.37.5. Display the results in the map

To display the results in a map, you need to access mapping services that use latitude and longitude, such as Google Maps or Baidu Maps:

Example

functionshowPosition(position){varlatlon=position.coords.latitude+", "+position.coords.longitude;varimg_url="http://maps.googleapis.com/maps/api/staticmap?center="+latlon+"&zoom=14&size=400x300&sensor=false";document.getElementById("mapholder").innerHTML="";} 

In the above example, we use the returned latitude and longitude data to display the location in Google Maps (using a still image).

11.37.6. Information for a given location

This page demonstrates how to display the location of a user on a map. However, geolocation is also useful for information about a given location.

Can be used to:

  • Update local information

  • Show the points of interest around the user

  • Interactive vehicle Navigation system (GPS)

11.37.7. getCurrentPosition() method-return data

If T is successful, then getCurrentPosition() method returns the object. Will always return latitude longitude and accuracy Property. If available, other properties below are returned.

Attribute

Description

coords.latitude

Latitude of decimal number

coords.longitude

Longitude of decimal number

coords.accuracy

Position accuracy

coords.altitude

Above sea level in meters

coords.altitudeAccuracy

Altitude accuracy of position

coords.heading

Direction, measured in degrees from due north

coords.speed

Speed, in meters per second

Timestamp

Date / time of response

11.37.8. Geolocation object-other interesting methods

watchPosition() -returns the user’s current location and continues to return to the updated location when the user moves (just like the GPS on the car).

clearWatch() -stop watchPosition() method

The following example shows watchPosition() Method. You need a precise GPS device to test this example (such as iPhone):

Example

varx=document.getElementById("demo");functiongetLocation() {if(navigator.geolocation){navigator.geolocation.watchPosition (showPosition);}else{x.innerHTML="This browser does not support obtaining geographic locations.";}} functionshowPosition(position){x.innerHTML="latitude:"+position.coords.latitude+" <br>longitude:"+position.coords.longitude;} 
《地理信息系统原理、技术与方法》  97

最近几年来,地理信息系统无论是在理论上还是应用上都处在一个飞速发展的阶段。 GIS被应用于多个领域的建模和决策支持,如城市管理、区划、环境整治等等,地理信息成为信息时代重要的组成部分之一; “数字地球”概念的提出,更进一步推动了作为其技术支撑的GIS的发展。 与此同时,一些学者致力于相关的理论研究,如空间感知、空间数据误差、空间关系的形式化等等。 这恰好说明了地理信息系统作为应用技术和学科的两个方面,并且这两个方面构成了相互促进的发展过程。