HTML5 Geolocation for IE8 and Mobile Browsers - html

So I have been developing a web application, and I have implemented the HTML5 geolocation feature. I have implemented this using Javascript code taken from Google's website, that interacts with the Google Map that I have on my page as well. Here is the code below:
// Note that using Google Gears requires loading the Javascript
// at http://code.google.com/apis/gears/gears_init.js
var initialLocation;
var siberia = new google.maps.LatLng(60, 105);
var newyork = new google.maps.LatLng(40.69847032728747, -73.9514422416687);
var browserSupportFlag = new Boolean();
function initialize() {
var myOptions = {
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
// Try W3C Geolocation (Preferred)
if(navigator.geolocation) {
browserSupportFlag = true;
navigator.geolocation.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
map.setCenter(initialLocation);
}, function() {
handleNoGeolocation(browserSupportFlag);
});
// Try Google Gears Geolocation
} else if (google.gears) {
browserSupportFlag = true;
var geo = google.gears.factory.create('beta.geolocation');
geo.getCurrentPosition(function(position) {
initialLocation = new google.maps.LatLng(position.latitude,position.longitude);
map.setCenter(initialLocation);
}, function() {
handleNoGeoLocation(browserSupportFlag);
});
// Browser doesn't support Geolocation
} else {
browserSupportFlag = false;
handleNoGeolocation(browserSupportFlag);
}
function handleNoGeolocation(errorFlag) {
if (errorFlag == true) {
alert("Geolocation service failed.");
initialLocation = newyork;
} else {
alert("Your browser doesn't support geolocation. We've placed you in Siberia.");
initialLocation = siberia;
}
map.setCenter(initialLocation);
}
}
So what this code does is, it checks to see if the browser you are accessing the site from supports the new WC3 geolocation features, and if it does, it uses that to find latitude and longitude. If you do not support it, it tries to use Google Gears to obtain that information, and finally, if you support neither, it bails out.
I am completely fine with using this the way it is for browsers like Firefox, Safari, Opera, and Chrome, because most new versions (and even some older ones), support these features, however, IE8 (9 works), doesn't :(
IE8 doesn't even use the Google Gears failsafe, it just doesn't work at all. Is there anyway (free like the above code), to use some form of geolocation on IE8, even if it's not as accurate to obtain latitude and longitude so I can plug it into the map?
Also, I haven't testing it yet but, if you were to log onto this site using a Mobile Browser (on the major devices), would it support WC3 Geolocation/Google Gears as well, or would it bonk out like IE8 does. I know I can also use the sensor=true attribute when requesting location if coming from a mobile device if they have their GPS turned on, so that's another way to do it, but I'd rather just use geolocation if they support it.
Thanks guys.

I am waiting for the HTML5 geolocation features to mature a bit more before I begin using them in full swing. In the mean time, I've used the APIs and datasets offered by MaxMind with great success.
Edit:
I forgot to mention, this sometimes doesn't work well with mobile browsers, so you may still want to use the HTML5 geolocation feature there as I've found it to be much more quick and reliable on mobile browsers.

Related

Wrong coordinates using HTML Geolocation API

I am trying to use HTML5 Geolocation API on Windows 10 using Chrome as a browser.
I am having problems with getting right longitude and latitude. I have tried also using some web applications such as where-am-i.me but it giving the same result. Only Google gives the right location. How I can fix this, can we use some Google API for this?
enter code here
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
$(".latitude").text(position.coords.latitude);
$(".longitude").text(position.coords.longitude);
showMap(position.coords.latitude, position.coords.longitude);
}

ol3 geocoder zoom level issue in chrome

I am trying to add ol3 geocoder control in my project. I have set fix zoom level and it is working in Mozilla and it comes properly with appropriate zoom level but in google chrome it is not working. It takes the location on deep zoom in level. I have to zoom out to check surrounding places.
var geocoder = new Geocoder('nominatim', {
provider: 'google',
key:' AIzaSyClQ0GOW55zhw4PvFh73FyGLHdSd4bJfpM',
lang: 'en',
placeholder: 'Search Location...',
limit: 5,
keepOpen: true,
autoComplete: true,
});
map.addControl(geocoder);
//Listen when an address is chosen
geocoder.on('addresschosen', function(evt){
var
feature = evt.feature,
coord = evt.coordinate,
address_html = feature.get('address_html');
content.innerHTML = '<p>'+address_html+'</p>';
if (coord) {
//alert("if--");
map.getView().setZoom(7);
overlay.setPosition(coord);
} else {
map.getView().setZoom(8);
overlay.setPosition(coord);
}
});
When using the latest version of geocoder (3.0.1) it seems you can set the zoom level within the function. I had the same problem when I switched to new version, but I played around and found that it works perfectly like this:
geocoder.on('addresschosen', function (evt) {
window.setTimeout(function () {
view.setZoom(12);
popup.show(evt.coordinate, evt.address.formatted);
}, 1000);
});
Obviously, use whatever zoom value you like.

How to simulate Geolocation service AS3

I'm creating an app that is using Geolocation servioce on phone o send location/time data over the internet. And that is working just fine. Problem is that I cannot test it in Flashdevelop, cause Geolocation is not supported, so I have to upload every time new code and test it on phone. Is there any way to simulate Geolocation service in Flashdevelop? Or generally, on desktop PC?
Sorry for bothering ... I found out... quite simple answer was..
private function startLocating():void {
var myLat:Number=44.2343;
var myLong:Number=20.9432;
_geo = new Geolocation();
_geo.addEventListener(GeolocationEvent.UPDATE, Handler1 );
if (Geolocation.isSupported) {
if (!_geo.muted) {
_geo.setRequestedUpdateInterval(1000);
} else {
trace ("Location service not turned on.");
}
} else {
/* this code is working when Geolocation is not supported */
_geo.dispatchEvent(new GeolocationEvent(GeolocationEvent.UPDATE,false,false,myLat,myLong));
}
}
private function Handler1(ev:GeolocationEvent):void {
var latitude:Number = ev.latitude;
var longitude:Number = ev.longitude;
.....
}

continous speech recognition with Webkit speech api

i started using this browser(chrome) feature.
i ve written a JS based on this , but the problem is even , it recognises the speech only once and ends . its not going continuously, i need to press the button again and again to start speech recognition . tell me where i should tweak . i ve set "recognition.continuous=true" still not helping ?
var recognition = new webkitSpeechRecognition();
recognition.continuous = true;
recognition.interimResults = true;
recognition.onstart = function() {
console.log("Recognition started");
};
recognition.onresult = function(event){
console.log(event.results);
};
recognition.onerror = function(e) {
console.log("Error");
};
recognition.onend = function() {
console.log("Speech recognition ended");
};
function start_speech() {
recognition.lang = 'en-IN'; // 'en-US' works too, as do many others
recognition.start();
}
I call "start_speech" from a button ! thats it
I know this is an old thread, but I had this problem too. I found that, even with the continuous flag set, if there are pauses in the input speech, a "no-speech" error gets thrown (triggers the onerror event) and the engine is shut down. I just added code in the onend to restart the engine:
recognition.onend = function() {
recognition.start();
};
The next problem you might get is, every time the engine restarts, the user has to re-grant permission to let the browser use the microphone. The only solution at this time seems to be to make sure you connect to your site over HTTPS (source: http://updates.html5rocks.com/2013/01/Voice-Driven-Web-Apps-Introduction-to-the-Web-Speech-API bottom of post in bold)
Perhaps the typo on this line:
recognition.continuos = true;
Should equal:
recognition.continuous = true;
recognition.onend = function(){
recognition.start();
// sets off a beep/noise each time it is accessed from a cell phone (Andoid).
// does NOT if accessed from a desktop (Windows using Chrome).
};

HTML5 geolocation won't work in Firefox, Chrome and Chromium

I'm trying to use the HTML5 geolocation API; but I have problems to make it work on Firefox Chrome and Chromium :
init();
function init() {;
// Get the current location
getPosition();
}
function getPosition() {
navigator.geolocation.getCurrentPosition(success, fail,{
enableHighAccuracy:true,
timeout:10000,
maximumAge:Infinity
});
}
function success(position) {
alert("Your latitude: " + position.coords.latitude + "longitude: "
+ position.coords.longitude);
}
function fail(e) {
alert("Your position cannot be found"+e.code+" => "+e.message);
}
In IE9 and Safari it works flawlessly; but :
in Firefox (v13 and V14) there is an error code 3 (timeout)
in Chrome and Chromium (v20 and v21) there is and error code 2 with the message "Network location provider at 'https://maps.googleapis.com/maps/api/browserlocation/json?browser=googlechrome&sensor=true' : Response was malformed."
I have a fresh install of Chrome (installed today on windows XP, no extensions) and I have authorized the geolocation in the browser.
You can try it there :
http://jsfiddle.net/mhj82/38/
Is there a solution to make it work on all browser supporting geolocation ?
Have you read this ?
http://code.google.com/p/chromium/issues/detail?id=41001
At the end of the thread they come to the conclusion that in order to work in Chrome, geolocation must be performed on a device with a working wifi adapter.
Was wifi enabled on your computer ?
(dunno for firefox)
I have to wait until the document is loaded to get it work in chrome
jQuery().ready(function() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition....
}
});
Try this tested in chrome desktop and mobile
if (navigator.geolocation) {
var latitude = null;
var longitude = null;
navigator.geolocation.getCurrentPosition(function (position) {
latitude = position.coords.latitude;
longitude = position.coords.longitude;
});
} else {
alert("Geolocation API is not supported in your browser");
};