I'm implementing some welcome messages to my site that show up at the beginning if the user hasn't enabled the Gps.
The thing is that after enabling the GPS via chrome UI js still can't access the gps postion (keep getting unables alerts on my web page). If page is reloaded then I can.
Is there a way to update the state of the blocking/nonblocking option without refreshing the whole web page ?
<script>
var button = document.getElementById("button");
button.onclick = function() {
var geoSuccess = function (position) {
var startPos = position;
alert("longlat" + startPos.coords.longitude);
};
var geoError = function (error) {
alert("unable");
};
navigator.geolocation.getCurrentPosition(geoSuccess, geoError);
};
</script>
Please check out this link :- GPS I do not know whether that is what you asked for but I can just tell it to you .It might help Please forgive me if that is irrelevant. The code is here :
<span id="demo" />
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>
The code above does the following :
Check if Geolocation is supported
If supported, run the getCurrentPosition() method. If not, display a message to the user .
If the getCurrentPosition() method is successful, it returns a coordinates object to the function specified in the parameter ( showPosition )
NOTE : The showPosition() function gets the displays the Latitude and Longitude
Related
I am using the code to get the geo-location on my site. for example
https://subdomain.domain.com/pwa
<script type = "text/javascript">
function showLocation(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
alert("Latitude : " + latitude + " Longitude: " + longitude);
}
function errorHandler(err) {
if(err.code == 1) {
alert("Error: Access is denied!");
} else if( err.code == 2) {
alert("Error: Position is unavailable!");
}
}
function getLocation() {
if(navigator.geolocation) {
// timeout at 60000 milliseconds (60 seconds)
var options = {timeout:60000};
navigator.geolocation.getCurrentPosition(showLocation, errorHandler, options);
} else {
alert("Sorry, browser does not support geolocation!");
}
}
</script>
<form>
<input type = "button" onclick = "getLocation();" value = "Get Location"/>
</form>
I added the above code in geoWatch.html.
when I visit the page and click on - get location. I am prompted to allow for - Geolocation, which I accept and I can see the same in settings for website the geolocation is allowed.
but immediately after I click on accept the allow notification - I get the error alert - Error: Access is denied.
I remember it was working fine, what and where I messed up, can't figure out what went wrong, so I took this sample code and put this both in pwa folder as well as in the root of the site to test, if any other code is conflicting, but it didn't helped.
Additional Note:
I installed chrome canary and there it(same code) is working fine.
Edit: Even Chrome Canary worked for the first try only. any subsequent try getting same error.
but Samsung Mobile browser working fine even after multiple tries.
I have a problem with geolocation on idevices on my website.
Actually I just need to get latitude/longitude coordinates.
On PC, android devices everything is cool, on iphone it also fine but only if I use wifi connection. But when i'm on 3g or LTE with my old iPhone 5s I simply get nothing (but starting from iphone 6 it works).
I've read that Safari is not supporting geolocation if wifi is turned off.
But still what I need is to make it work on iDevices such as iPhone 4,5.
I'm using this piece of example code:
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>
I'm an iPhone 5S owner and tried the geolocation over 3G and it works like a charm. I've tried this CodePen over Wifi and over 3G without any issues.
$(document).ready(function(){
setInterval(function(){
getLocation(function(position) {
//do something cool with position
currentLat = position.coords.latitude;
currentLng = position.coords.longitude;
$("#status").html(currentLat + " " + currentLng);
});
}, 1000);
});
var GPSTimeout = 10; //init global var NOTE: I noticed that 10 gives me the quickest result but play around with this number to your own liking
//function to be called where you want the location with the callback(position)
function getLocation(callback) {
if (navigator.geolocation) {
var clickedTime = (new Date()).getTime(); //get the current time
GPSTimeout = 10; //reset the timeout just in case you call it more then once
ensurePosition(callback, clickedTime); //call recursive function to get position
}
return true;
}
//recursive position function
function ensurePosition(callback, timestamp) {
if (GPSTimeout < 6000) {
//call the geolocation function
navigator.geolocation.getCurrentPosition(
function(position) //on success
{
//if the timestamp that is returned minus the time that was set when called is greater then 0 the position is up to date
if (position.timestamp - timestamp >= 0) {
GPSTimeout = 10; //reset timeout just in case
callback(position); //call the callback function you created
} else //the gps that was returned is not current and needs to be refreshed
{
GPSTimeout += GPSTimeout; //increase the timeout by itself n*2
ensurePosition(callback, timestamp); //call itself to refresh
}
},
function() //error: gps failed so we will try again
{
GPSTimeout += GPSTimeout; //increase the timeout by itself n*2
ensurePosition(callback, timestamp); //call itself to try again
}, {
maximumAge: 0,
timeout: GPSTimeout
}
)
}
}
Thanks to Chris Beckett for the sample.
Maybe you can provide more details if you can't get it working yet?
Ps: just editing to make sure everyone who needs geolocation check if location services for Safari is enabled:
First check if Location Services is enabled under: Settings > Privacy > Location Services
Next check if it is enabled for Safari Websites
Working currently with the HTML5 Geolocation and I've tested it on all web browsers and it seems to be working. However when I test the Geolocation on the iPad, it works for the iPad mini all the time, but when I put it on the bigger iPad (iPad 2) the location doesn't seem to work all the time.
I'm trying to do this web-side so that the solution can be ported over to multiple platforms and not just iOS.
Edit:
Just tried, It works in the safari browser but it's just not working inside the iOS application.
Does anyone have any ideas why it's not working?
Internet: Tried Wi-Fi and tried hotspot, and also tried Wi-Fi turned on without connecting to anyones.
iOS version: 8.3
The location should be displayed here:
$("#status").html(currentLat + " " + currentLng);
Code:
<!DOCTYPE html>
<html>
<head>
<script src="js/jquery-1.11.3.min.js"></script>
<script>
//example
$(document).ready(function(){
setInterval(function(){
getLocation(function(position) {
//do something cool with position
currentLat = position.coords.latitude;
currentLng = position.coords.longitude;
$("#status").html(currentLat + " " + currentLng);
});
}, 1000);
});
var GPSTimeout = 10; //init global var NOTE: I noticed that 10 gives me the quickest result but play around with this number to your own liking
//function to be called where you want the location with the callback(position)
function getLocation(callback)
{
if(navigator.geolocation)
{
var clickedTime = (new Date()).getTime(); //get the current time
GPSTimeout = 10; //reset the timeout just in case you call it more then once
ensurePosition(callback, clickedTime); //call recursive function to get position
}
return true;
}
//recursive position function
function ensurePosition(callback, timestamp)
{
if(GPSTimeout < 6000)//set at what point you want to just give up
{
//call the geolocation function
navigator.geolocation.getCurrentPosition(
function(position) //on success
{
//if the timestamp that is returned minus the time that was set when called is greater then 0 the position is up to date
if(position.timestamp - timestamp >= 0)
{
GPSTimeout = 10; //reset timeout just in case
callback(position); //call the callback function you created
}
else //the gps that was returned is not current and needs to be refreshed
{
GPSTimeout += GPSTimeout; //increase the timeout by itself n*2
ensurePosition(callback, timestamp); //call itself to refresh
}
},
function() //error: gps failed so we will try again
{
GPSTimeout += GPSTimeout; //increase the timeout by itself n*2
ensurePosition(callback, timestamp);//call itself to try again
},
{maximumAge:0, timeout:GPSTimeout}
)
}
}
</script>
</head>
<body>
<div id="wrapper">
<!-- Page heading -->
<h1>Geolocation</h1>
<!-- Status -->
<p>Finding your location: <span id="status">checking...</span></p>
</body>
</html>
I thought you should get location's permission first.
Add NSLocationWhenInUseUsageDescription or NSLocationAlwaysUsageDescription in App-Info.plist and give it a string.
Try with above, and see if that helps.
simple for no timer
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<BR><BR><BR><BR>
<button onclick="getLocation()">get Location</button>
<script>
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(alertPosition);
} else {
alert("Geolocation is not supported.");
}
}
function alertPosition(position) {
alert("Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude);
}
</script>
</body>
</html>
I discovered this strange behavior with the web application that I am developing using html5's geolocation API. The problem only occurs if the website is bookmarked and then run in the full screen mode on the iPad using
<meta name="apple-mobile-web-app-capable" content="yes" />
in the header.
The code I am using:
function getLocation() {
if (navigator.geolocation) {
alert("No problem up to here");
navigator.geolocation.getCurrentPosition(showPosition, noLocation, { timeout: 10000 });
}
else {
alert("Geolocation is not supported by this browser.");
}
}
function showPosition(position) {
alert("position: " + position.coords.latitude + ', ' + position.coords.longitude);
}
function noLocation(error) {
alert("error.code:" + error.code);
}
And then I am calling getLocation() from another function:
timer = window.setInterval(function () { getLocation() }, 10000);
(and yes, I already have declared timer)
I used the word "choke" because I can see "No problem up to here" alert every 10 seconds, the "position:" alert just once, and after then neither of the "position:" or "error.code:" alerts are showing up.
Any ideas why this is happening?
I am writing a Java script for HTML 5 geolocation but it doesnt seem to work and when I try to output the contents in another scope, it says undefined. Below is the code.
<script>
var lat;
var lng;
function getLocation()
{
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition);
}
else{}
}
function showPosition(position)
{
lat = position.coords.latitude;
lng = position.coords.longitude;
document.write(lat); // Doesnt output anything
}
</script>
<script type="text/javascript">
document.write(lat); // It says undefined
$(document).ready(function()
{
//some scripts here
}
</script>
The success callback functions are called only when the html page is hosted on a web server, not in localhost. Are you testing locally or on a webserver?