HTML and CSS Reference
In-Depth Information
In the callback function, set the URL of the image to the appropriate
Google Maps API call:
function init() { if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position){
writeLoc(position.coords); });}
function writeLoc(coords) {
var l = 'http://maps.google.com/maps/api/staticmap?center=' +
coords.latitude + ',' + coords.longitude +
'&zoom=12&size=440x440&maptype=roadmap' +
'&markers=color:red|color:red|label:a|' +
coords.latitude + ',' + coords.longitude +
'&sensor=false';
document.getElementById('location').src = l;
document.getElementById('debug').innerHTML = l;
}
When the image URL is set, the browser will load the appropriate map
from the Google Maps API .
Now you know where you are. What about telling someone about it?
Communication is central to the web, but web pages have been
constrained in what they're allowed to communicate with and how
they're allowed to do it. HTML5 offers new communication APIs: for
communicating in a safe way in browser based apps, cross document
messaging; and for communicating efficiently with a server in real time,
the WebSocket API. The next section looks at these APIs in more detail.
Communication in HTML5
The communication model in HTML4 is pretty much the same as it was
in the first version of HTML . The user requests information from a
server, and then the server delivers it. Although innovations like the
XMLHTTPRequest object allow us to do some cunning things, the underly-
ing model is the same. In addition, content loaded from different serv-
ers is usually shielded from other servers—a policy known as same
origin restriction .
This section necessarily involves some interaction with a
server; discussing how to get everything working on all
possible architectures will take too many pages. If you're
not comfortable with the server side of things, skip ahead.
Search WWH ::




Custom Search