Note: This project was written for an early, pre-release version of Flash 9. Have a look at my MXNA Dashboard, which has been updated to work with the proper final version of the player.
I’ve been studying data visualization recently. During my research, I came across Newsmap. It uses a treemap structure to visually compare the importance of current news items on Google News. This weekend, I built a similar application based on data from the MXNA. Please note that you need Flash Player 8.5 beta to view the demo. If you aren’t a Flash developer, you probably don’t have it. Certainly, this could be done with an earlier version of Flash, but I wanted some practice with AS3.
The MXNA provides web services and Flash services for developers to make use of the posts it aggregates. I’ve never used FlashVars before, so I decided to use those instead of the XML web service. Luckily, AS3 provides the useful URLVariables class, which automatically parses FlashVars into a simple object.
Nodes on the map display the post title, and the user just needs to click on them to navigate to the post. The size of the node’s rectangle is based on the popularity rank provided by the MXNA. Brighter rectangles indicate newer posts. You’ll instantly notice that newer posts tend to have a lower rank because they haven’t had as much exposure. New posts with larger nodes can indicate popular subjects or well-written headlines.
Currently, the map only shows the newest 25 posts, but the webservice will provide up to 50. Alternatively, the map could show only the most popular posts for the whole day. I could also get posts by category only, such as Flash or ColdFusion. Even better, the map could be expanded to hold a series of sub-maps that show the relative popularity of each of the categories. Arguably, the best solution might be to create a series of tabs to allow a user to choose which option he or she prefers.
Hey, the demo is broken if you visit it with less than flash 8.5 – i have flash 8 on osx, and since you are trying to invoke the expressinstall, it just hangs there with nothing on the page. (you can’t use expressinstall to update to flash 8.5 yet because it’s still in beta)
Also if you want a script that might be a little easier to use than the MM detection kit, try this one out:
http://blog.deconcept.com/flashobject/
Visually Mapping MXNA with ActionScript 3
Josh Tynjala over at zeusdesign has put together a cool news map of the most popular items on MXNA using ActionScript 3 and the Flash Player 8.5 beta. It requires the 8.5 player beta, which you can grab from labs….
That’s why I included a warning that 8.5 is needed to view the demo. I’m aware of FlashObject, but I just used the html generated by Flex Builder. If I have some time after work today, I’ll update it with FlashObject… to warn you again
I updated the page to include the FlashObject script. It’ll let visitors know if they don’t have the required version.
I also changed the map to do color calculation based on an 8 hour period instead of a full day. I built and tested it over the weekend, and bloggers aren’t quite as active on weekends as they are during the week. As a result, the map showed very few dark colors today.