Patrick Matte » TBWA\Chiat\Day Los Angeles

Simulating Google Earth with the Google Maps API for Flash

Patrick Matte — Mon, 16 May 2011 23:03:41 +0000

I made some research on how to simulate Google Earth in Flash for a recent project at TBWA\Chiat\Day. Unfortunately the schedule was too tight and a freelancer was called in to build the module which in the end only used the regular google maps top view. But I wanted to share my research anyway.

Click to open SWF

The tricky thing is that the grid in Google Maps is square and as you can see in the background, the latitude is not distributed evenly. So you can’t simply take the square map and put it on a sphere or it will appear very distorted. What you need to do is find the latitude/longitude of the 4 vertices of every face on the sphere and then use the method fromLatLngToViewPort which returns the Point on the map that corresponds to that latitude and longitude. Once you have all four points, you can draw that particular section of the map and use it as a material for the face. One thing worth mentioning is also that for some reason, the satellite view only has map available from 85 degrees to -85 degrees of latitude, so you have to patch the top and bottom of the sphere manually.

Maybe I’ll revisit this at a later time and make it possible zoom in on the map.

Download the source files.

Some generative art for our “25 lines of code” contest at TBWA\Chiat\Day. I won at unanimity!

Patrick Matte — Sun, 26 Jul 2009 02:44:35 +0000

The rules of the contest were simple, create the most awesome program in just 25 lines of code. The timing was pefect for me as i wasn’t too busy for the last two days before the deadline and i was able to work on a few entries.

Click to open SWF

This one nailed it. I’m still surprised how many things i was able to cram into 25 lines! I have a 3D engine in there that converts 3D points to 2D points in 3 lines of code! And the routine also changes the color of the lines, records arrays of points to create the trails that gets thinner as time increases. Also notice the velocity on each point that make the trail move along.

Download source fla

I’m definitely happy with the first one but there’s another entry that i did which i also like.

Click to open SWF

For that one I got the inspiration from a demo i saw last week, and i thought to myself, “hey i can do this in 25 lines of code” so i did it. Some images it creates look a lot like those spacy tracy desktop backgrounds of Windows Vista and OSX.

Download source fla

Simulating liquid with actionscript 3 and physics engine APE.

Patrick Matte — Tue, 16 Jun 2009 07:08:00 +0000

I created a quick prototype of a realtime liquid simulation for a project over at Chiat a couple weeks ago. The result might not be very realistic, a little cartoony you might say, but it’s definitely fun to play with (any program that features real-time physics just fascinates me). I made a quick demo to show you how it’s done.

Click to open SWF

I quickly looked at some reviews to make my choice on the physics engine i would use and APE seemed to be the simplest one. It was pretty simple indeed as i was able to put up my original demo in a single day. It was a little tricky to create the physics bottle that would hold the particles. The easiest way i found was to put movieclips on stage in the shape of the bottle and loop through each pieces and create a corresponding APE RectangleParticule. The tricky part is that when you rotate a movieclip in flash, the height and width of the clip changes, so i had to nest a movieclip within to be able to read the correct height and width of the particle.

Download the source