HTML5 geographic location instance and html5 geographic instance
This article mainly introduces the HTML5 Geographic Positioning method. The example describes the complete implementation process of html5 coordinate acquisition and provides reference results for comparing the running effects of different browsers. For more information, see
The example in this article describes how to use html5 to obtain geographical location information and share it with you for your reference. The specific method is as follows:
The html5 code for obtaining coordinates is as follows:
The Code is as follows: <! Doctype html>
<Html>
<Head>
<Title> test1.html </title>
<Meta http-equiv = "keywords" content = "keyword1, keyword2, keyword3">
<Meta http-equiv = "description" content = "this is my page">
<Meta http-equiv = "content-type" content = "text/html; charset = UTF-8">
<! -- <Link rel = "stylesheet" type = "text/css" href = "./styles.css"> -->
</Head>
<Body>
<Div id = "demo"> click this button to obtain your coordinates: </div>
<Button onclick = "getLocation ()"> try it </button>
<Script type = "text/javascript">
Var x = document. getElementById ("demo ");
Function getLocation (){
If (navigator. geolocation ){
Navigator. geolocation. getCurrentPosition (showPosition );
} Else {
X. innerHTML = "the browser does not support this !!! ";
}
}
Function showPosition (position ){
X. innerHTML = "Latitude:" + position. coords. latitude + "<br/> longpolling:" + position. coords. longpolling;
}
</Script>
</Body>
</Html>
After testing, the coordinates can be obtained successfully on IE9, firefox, chrome, and opera, but the coordinates cannot be returned on safari 5.x. In the successful cases, chrome responded the fastest, followed by opera, followed by IE9, and firefox was the slowest. I personally expressed my disappointment with firefox, but chrome is even better.
I hope this article will help you with HTML5 program design.
This is difficult, but it is determined by the Communication Base Station. Generally, the error is about meters or more, and the approximate positioning should be OK.
How does html5 implement Geographic location locating?
Support Detection if (navigator. geolacation) {// supports geographic location} else {// does not support geographic location}
Support: The IE9 version is not supported.
Var geo = navigator. geolacation;
Geo. getCurrentPosition (function (pos ){
// Longitude: pos. coords. latitude
// Latitude: pos. coords. longpolling
})
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
