It took me three months to do it, but the code to visualize the growth of Walmart is now available under a BSD license (that means free and open like a leaf in the wind):
Download Walmarts.tar.gz
I’ve included the Actionscript and the Walmart openings data, which should be all you need to create your own Walmart growth visualization, or if you’re more industrious, some other type of growth in the world. Let me know if you’re able to improve upon my code as there’s definitely a few areas that wouldn’t mind some improvement.
So go wild, have fun with it, and let me know if you apply the code to another dataset. (I also wouldn’t mind if someone wrote some documentation.)
UPDATE: I am no longer supporting this code.
Nathan – Wonderful, thanks for sharing your work with all of us!
“He who receives an idea from me, receives instruction himself without lessening mine; as he who lights his taper at mine, receives light without darkening me.”
Thomas Jefferson would be proud! :)
Doh! Just figured out how to do it by looking at the Visitr source code.
Fascinating! I love your visualizations. Keep them coming!
awesome, yet scary. I’ll love to see just the map and the data and let someone try to figure out what they are looking at (is it a disease?) before telling them.
Got any Starbucks maps coming down the pike?
@Aiolos – maybe you know a better way to implement this walmart map then :)
How do I get this to compile? Will I need to use Adobe Flash CS4? Using Adobe Flash CS3 I’m missing import mx.effects.easing.
@bowlofudon – Actually, I use Flex builder 3 for all of this since it’s all actionscript. It’s available for free 30-day trial on Adobe, but even better, it’s free for students: http://flexregistration.com
I haven’t used Flash, but I’m pretty sure there’s an equivalent that you can use – like import flash.effects.easing… um, try googling flash easing maybe?
hi nathan,
can you please provide some sample code on how to create a flex application from you code.
Regards,
dz
You can build this with the free Flex 3.0 SDK too. (No Flex Builder or other IDE.) Just use:
mxmlc Walmarts.as
The code, as written, gives you black text on a gray background. (It’s just a desaturated version of the Microsoft maps.) To get white text on a black background, like in the map above, add a line like this to Walmarts.as to invert the colors (put it before addChild(map)):
map.grid.transform.colorTransform = new ColorTransform(-1,-1,-1,1,256,256,256,0)
I got that tip from the Modest Maps people (http://getsatisfaction.com/modestmaps/topics/white_text_on_black_and_white_map).
Oh, and you should test the resulting .swf on a web server. You need to put the data file walmarts.xml in the same directory as the .swf, but the .swf won’t load it if it’s just on the local filesystem.
And thanks, Nathan! This is really cool.
@Scott – Sure thing. I’m glad you could make use of it. You can put walmarts.xml outside the .swf directory too. You just have to change the URL in the actionscript.
Hi, thanks for posting this.
I don’t know much about Flash but would like to add support for Flash displays like this to some software I’m working on. What is the best way to provide data to Flash? Is URLRequest the only way for AS programs to obtain external information, or does anyone know if there’s some kind of registry in the Flash runtime I might be able to access? Thanks
Thanks very much for sharing Nathan! This is a superb example to learn from – much appreciated.
@bowlofudon:
just replace mx.effects.easing.* with fl.motion.easing.* in a AS3 project.
Hi Reed,
There are several other methods, but the programming can get a bit complex… For example, AMFPHP lets AS3 make remote calls to PHP scripts in order to interact with a database or handle other tasks.
Check out friendsofed.com which has published a number of books on this topic.
Pingback: System Advancements at the Monastery » Blog Archive » Some Ideas on Geocoding Security
Fantastic! Thank you!
Thanks for making this awesome project open-source. Just some advice for others that might be using it:
One variable I had to find and change that wasn’t in the Walmart.as file is below. I also found it wasn’t working right if one of the counts was 0 in the array. For me, it wasn’t a problem to just change a store to a previous year – but for others you might need to find a work-around.
storesPerYear = [1,33,22,4,5,6];
in:
\com\flowingdata\gps\MarkersClip.as
Looks like I want to move to Montana.
Pingback: ++ t-empire.com ++ » Blog Archive » twitterã§ã®ã‚ªãƒãƒžå¤§çµ±é ˜å°±ä»»å¼ç¥ç¦ã‚’å¯è¦–化
It might just be that I’m a flex n00b, but I’m having some difficulty importing the files into flex. I’ve tried “import other” and after it imports the “walmarts” folder I get a message saying the “application ‘walmarts.as’ has been deleted.” “import project” just gives me some jive about “libraries.” In either instance I’m not allowed to run “walmarts.as” :(
Any ideas? I really love this visualization and think it can really help with my own project. I want to create a map of Atlanta featuring ONLY strip malls. Woo woo!
Help is very much appreciated! thanks yall.
Pingback: The Growth of Target | Maps & Atlas
1) Adam, trying going to File, New, ActionScript Project, and name it Walmarts, then for project folder, point it to where you have the files for this app. It will make it runnable in Flex.
2) If anyone else is having trouble accessing the walmarts.xml file locally, add this switch to your compiler options in the Properties section for the project.
-use-network=false
That will allow you to run it without uploading to a server.
Jon
What about a slightly different dataset? I work for a non-profit Foundation that has given approximately 10,000 grants since 1986, each of which has a date and city,state location. If we had code for this, we would show it to Congressional staff, federal agencies, and otherwise have great ways to disseminate this really cool mapping display you’ve created.
One thing you should mention is that the included TweenLite library is *not* BSD: http://blog.greensock.com/licensing/ , so if you want to include this code in a commercial product you’ll either need to modify it to avoid that library or pay the licensing fee to TweenLite.
Thanks for this!
I’ve got it working as an ActionScript Project with my data, which is great. I’d like to incorporate it into an existing Flex Project. How can I do that?
Pingback: what week is it? « // 610: 591: infoviz
MXML
Just in case my earlier post was unclear:
I need to get the (adapted) Walmarts visualization to work with the MXML of an existing Flex Project. Even after adding the ‘com’ and ‘gs’ folders and the Walmarts.as file to my Flex Project, and updating the Walmarts.as package name (it’s in my ‘components’ folder), Flex can’t resolve it as component implementation (e.g., ). Trying to use the SWFLoader hasn’t worked either.
I can link to the result of the AS3 project (which works fine) as a separate HTML page, of course, but I it’s disjointed: need it to be interactive with MXML components and integrated with the rest of the app.
Could someone please help me out or point me in the right direction? I have a looming deadline and, yep, I’m a beginner. Thanks.
(I haven’t yet found a solution on other forums, including ModestMaps.)
Hey Pete,
I had quite a bit of trouble getting it into flex. You can make some headway by using a Sprite UIComponent wrapper. See example here:
http://butterfliesandbugs.wordpress.com/2007/10/22/how-to-add-any-actionscript-object-to-a-container-like-a-sprite/
This will at least get it onto your page in MXML.
But it is still pretty hard to work with and interact from other Flex object I found. Eventually it was just too much hassle for me so I made the other components I needed in AS and just did a whole actionscript project.
Thanks, Jon! This gives me a good start. Much appreciated!
Thanks for providing the source. :)