how Google Maps works

If you haven't seen Google Maps yet, check it out: it's pretty impressive! If, like me, you're too lazy to read the source to figure out how they accomplished it, that's fine, because this guy has posted an analysis. Short version: lots of transparent PNG overlays, and communication with the server by treating a hidden IFRAME as a socket.
Current Music: Recoil -- Stalker ♬

41 Responses:

  1. parkrrrr says:

    I don't know if it's interesting to anyone but me, but the encoded string in the <points> element for a route contains actual latitudes and longitudes for the entire route, suitable for munging and uploading to a GPS receiver. I posted some Perl to decode it over on Slashdot (same username.)

  2. And if you pan all the way out you get to see the world map as displayed in US highschool textbooks!

  3. thanks for the heads up.

  4. bitwise says:

    It's pretty clear the map chunks are all prerendered and use easily-understood URLs, so who's going to be first to write an app that will stitch together a map of any size?

    Failing that, I seem to recall somebody here wrote a script that used VNC+mozilla to take long, tall "screenshots" of an entire web page. Any chance of redoing that to capture a massively huge Google Map? I wonder if their code is smart enough to stop loading tiles if your screen appears to be 20,000 pixels square...

  5. Very cool, but I do like the way that the rest of the world is just kind of missing...

  6. Doesnt' support Safari. Grumble, mutter.

    • mackys says:

      That one still has me scratching my head. Are these browsers so different (or is Google maps doing things that are so browser dependant) that they can't support anything except IE and Moz derivatives?

      I guess I should be happy they bothered to make it work in anything else besides IE. Most websites these days don't seem to even bother with that much.


      • jwz says:

        This question is, of course, answered in the link you didn't click...

        • mackys says:

          The reason why Google Maps doesn't work in alternative browsers is because XSLTProcessor is an invention of Microsoft which was picked up by the Mozilla team at some point, just like XmlHttpRequest.

          • wilecoyote says:

            So let me get this straight: all these incredibly cool things that Google is doing with the browser (not just maps, but also Google Suggest) are possible thanks to non-standard technologies first introduced by Microsoft?

            Great. That's some cognitive dissonance for you. Let's see how the Google fanboys (who usually tend to be open source/anti-M$/W3C standard zealots too) react.

            • fgmr says:

              Netscape had some pretty fancy stuff (e.g. javascript "style sheets," which could change the html document), but it got stomped as "nonstandard" in favor of things like CSS. I remember an intern at netscape wrote a FPS in browser-side javascript. (I don't know if that was with a released version of the client, or an ill-fated version.) So I wouldn't say microsoft is "first" introducing such technology; if anything, they set things back half a decade.

  7. flipzagging says:

    To do driving directions, they let your browser request a line drawing with coordinates. This means Google will draw you any line drawing, (well, in that semi-transparent blue) as long as you know how to encode the URL.

    Here's a little Perl program to make your own.

    For instance, here's Google drawing a circle.

    • jwz says:

      I am experiencing a strange kind of cognitive dissonance here. One the one hand, that's really cool, and on the other, I can't think of a single thing to do with it. I mean, it's less useful than ringing the bell on a teletype. It's pulling my brain apart.

      • flipzagging says:

        Yeah. I guess they did it this way because their cluster is way too big to do something secure-ish like generating the image server-side, and handing the user an opaque ID.

        Perhaps some dumbass could make a genuine Google URL that displayed some crude graffiti? Well, I've given them the tools now.

  8. thaths says:

    So, jamie, when can we expect a xscreensaver module that grabs pre-rendered blocks of map images and does a flyby? I will start my coding today. There are faster coders than I that will likely get this done quicker.

  9. srcosmo says:

    Finally I can reenact the satellite zoom-in scene from every thriller movie!

  10. srmanek says:

    The map looks a lot like simcity. Now we know what game the google developers like to play.

  11. d1663m says:

    About a two years ago, I gave Mapquest the idea in a suggestion, even went into some detail how it could be pulled off. My idea involved a java thin-client, not sure how much more elegant that would be. This one seems to be (mostly) AnyBrowser(tm) friendly anyway.

    Nice to see somebody put "my" ideas into action! :) Maybe google hired up the dude at Mapquest who read my note? It could happen!