2. Juli 2010
von Hannes
3 Kommentare
Yeah yeah i know, HTML5 is the new web 2.0 or whatever and everyone has to blag about it, but to be honest, most of the improvments are pretty good, I’m not just talking about the semantics and the end of XHTML (Hooray) but i wont cover that here. Here is what I’m gonna do, show you what you can do with the geolocation API and Yahoos Placefinder API.
Geolocation API is by now implementet in most of the browsers besides IE, of course, so its as usual a nice-to-have thing for desktop devices, of course for mobile, its a completly different matter. But if you wanna know more about it, read it up, there are plenty of rescources avaible on the net.
Yahoos Place finder is, in there own words “Yahoo! PlaceFinder is a geocoding Web service that helps developers make their applications location-aware by converting street addresses or place names into geographic coordinates (and vice versa).” And yeah, besides the marketing spin, that is what it does, you provide latitude and latitude and Placefinder tells you where the hell you are.
I made a short example you can check it out here.
The Code is as slim as they come:
PHP:
$search = 'http://where.yahooapis.com/geocode?q='.$_POST['lat'].',+'.$_POST['lon'].'&gflags=R&appid=[yourappidhere]';
$xml = simplexml_load_file($search,'SimpleXMLElement', LIBXML_NOCDATA);
echo $xml->asXML();
HTML/JS
<h1>Utilizing HTML5 Geolocation API and Yahoo! PlaceFinder Example</h1>
<div>You are currently in <strong> </strong> - <strong> </strong>, well to be more precisely in <strong> </strong> and your ZIP is <strong> </strong>'ish</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript">// <![CDATA[
$(document).ready(function() {
navigator.geolocation.getCurrentPosition(
function(position){
$.ajax({
type: 'POST',
url: '/sandbox/utilizing-html5-geolocation-api-and-yahoo-placefinder-example.php',
dataTyoe: 'xml',
data: ({
lat: position.coords.latitude,
lon: position.coords.longitude
}),
success: function(xml){
$('#city').html($(xml).find('city').text());
$('#country').html($(xml).find('country').text());
$('#neighborhood').html($(xml).find('neighborhood').text());
$('#plz').html($(xml).find('uzip').text());
}
});
}
);
});
// ]]></script>
So you see, with literally no Work whatsoever you can get quite some Information, whatever you with them, is of course up to you, but remember if the user provides the Information or not is up to him!