Tips on using the Google Maps San Francisco Earthquake page. And the story behind it.
by Brian Morearty
April 14, 2006
Have fun. Look around. See where the airplane is going. Drag the map with your mouse. Zoom in. Zoom out. Shake it all about.
Those cable cars are running along the real Powell-Hyde and California St. lines. Zoom in real close and you'll be able to see that it's true. If you live in the Bay Area and haven't been on a cable car in a while (I understand—the locals never go on the tourist attractions), do yourself a favor and do it. Bring a visiting relative if you need an excuse. They are so much fun. If you don't believe me, ask my father-in-law. He was a San Francisco cable car mechanic for 30+ years.
It works best in Internet Explorer or Safari. Firefox flickers way too much when the cable cars etc. move on the map. I haven't tried it with IE on the Mac or Opera. Or WebTV. (Remember that?)
The longer you let it run, the more memory your browser will use. Navigate away from the page or close your browser to free up the memory. After 5 minutes, the SFFD puts out the fires and the only thing still moving is the airplane. I did that because of the memory problem—I didn't want anyone's computer to get all breaky on me. (The cable cars had already broken down when the quake hit. They came off the tracks.)
Update: I tried caching them. It did decrease the rate at which memory was consumed, but it also caused the status bar to flicker like crazy with "loading plane.png" and made the cursor flicker too. It looked horrible. So I didn't upload the fix.
Hit the S key if you would like to Start and Stop the shaking.
On April 6, 2006, I was sitting looking out the window daydreaming when it dawned me that it might be possible to make a Google map shake like an earthquake. Huh huh, cool, I thought. When I realized there were just 12 days til the 100th anniversary of the 1906 quake, I figured I'd better get cracking!
Learning the Google Maps API was ridiculously easy. Kudos to the guys down the street on making such an easy API. Within an hour of sitting down, I not only had a map on my page but I also had it shaking. Because Google Maps does smooth scrolling, the look was awesome. I was inspired.
Fun. Whizz. Whee!
Thanks to DonkeyMagic Google Map Maker, without which it would have been pretty dang hard to place those landmarks in exactly the right spots! By the time I learned of this site I had already taught myself how to write the code to add icons to the map. But DonkeyMagic made it easy to just click on a spot (like the corner of California & Market) and get its exact latitude and longitude. Then I copied n pasted it into my page.
Thanks to my beautiful wife Kathleen for putting up with my late nights while I did this.