How does Google Maps work?

Question

What is the name of the technology behind Google Maps which allows the server to send only the part of the map requested from the user to enhance the performance, and is there any library to handle this?

Answer 1

The client technology is simply AJAX. Asynchronous calls are made back to the map server for what are called "tiles", ie PNG's that represent small sections of the map on display.

On the server side, there will be a lot of code that Google staff have written, a very big database and lots of disk space.

Answer 2

AJAX allows you to update part of the page from the javascript. Basically the javascript makes a request back to the webserver and replaces part of the existing page with the result.

JQuery is one library that makes this easier. I don't know what google uses.

Answer 3

It's just a huge image consisting of square chunks that are downloaded indepedently (using AJAX and so on). I believe it's done by some kind of internal Google libraries (could be also GWT).

More on this topic: http://blog.grimpoteuthis.org/2005/02/mapping-google.html

Answer 4

If you look at the link for a google maps page it will look like this:

http://maps.google.com/maps?f=q&hl=en&sll=37.0625,-95.677068&sspn=53.345014,88.769531&ie=UTF8&ll=41.226264,-81.454246&spn=0.012507,0.021672&z=16

The javascript code on the page and the server code use the numbers in the link to determine the location of the map you are viewing, the zoom level, and the size of your viewing window to determine the tiles to send to your browser.

There are commercial libraries that can provide the mapping data as well as tools to display and navigate the data. One I've seen used before is Geomicro

Answer 5

The technology could generically be described as a map server. The map server generates a map for the requested location from a large set of pre-generated map tile images covering the entire planet. The map server may overlay data from other databases on top of this. The combination of a map viewer client and geographical database is traditionally called a Geographical Information System (GIS).

Anyone can write web applications that embed Google maps using the Google Maps API.There is also a fine open source map server (called MapServer) should you wish to deploy your own map server.

Answer 6

Google Maps and Google Earth use something known as KML, or "Keyhole Markup Language", which is a special variant of XML. It's named in tribute to the first geo-tracking satellites. You can store information on a location in Google Earth (and it will eventuall trickle down to Google Maps) by using this markup to geocode its specific latitude and longitude coordinates. You can even include altitude.

Answer 7

This is something that you can try out yourself with OpenSource, http://www.geoserver.org http://www.openlayers.org and last but not least http://geowebcache.org/

You should be able to setup a minimal environment that does something similar to maps.google in a couple of hours.

Answer 8

You can also use the Google Maps API with your own images. Of course, they don't need to be a map; they can be any images. This will allow the user to drag and zoom, like in Google maps.

Answer 9

As stated, Google generated all of these 256x256 tiles and is just serving the relevant tiles. From your comments it seems that you are looking for something to generate these tiles for you. Several people have written code to chop an image into tiles - for instance http://crazedmonkey.com/blog/googletilecutter or http://www.klokan.cz/projects/gdal2tiles/ both seem to be able to do what your looking for.

Answer 10

Here's a nice rundown of an open source stack for generating Web-based maps from one of the founders of EveryBlock.com: http://www.alistapart.com/articles/takecontrolofyourmaps

Answer 11

Not to answer the question, just broader the information. Microsoft has something called "Deep zoom" for Silverlight that makes it easy to do that kind of effect.

Its a free composer where you tile upp your pictures (or one big picture) and do some other settings, then it breaks it down to a lots of smaller pictures in subfolders, one folder for each zoom-level. And then creates a page that can consume those in a smooth way.

A good blog entry about it: http://weblogs.asp.net/jgalloway/archive/2008/03/21/why-silverlight-2-deep-zoom-really-is-something-new.aspx

Answer 12

The generic name for the underlying discipline is GIS.

Are you asking for more details out of general curiosity, or do you have a specific technical need for a project?

Answer 13

I think it downloads the map as smaller tiles which it displays onto a canvas element which is wrapped in Google's "Canvas for IE" project in IE. But I am not sure...

That's how I would do it ;)

Answer 14

I'm working on a cross browser viewer for very large historic plans and scetches. A good help for the first steps (an old blog) I found at http://www.cadmaps.com/gisblog/?p=7 to understand image pyramids (that's what Google Maps works with).

With a 'tiler' I produce a lot of images like testImage_0001111100.png. 0001111100 is i.e. 5th zoom level and x / y position in the image pyramid. Most of calculation (neighbor images, image stack up and down) is done serverside by php called by ajax requests.

I'm struggling in the moment with (not insolvable) problems in smooth shifting and zooming. That's my problem - but read the article.