Make Your Java Data More Useful with Treemap Visualization

isualization is all about taking data and turning it into useful information. The technique is glaringly useful and widely used. Consider the following situation: you want to display the profiles of the population of a country, divided by age.

Age Group

Number of People

0-18

1,452,382

18-35

1,231,987

35-50

842,427

50+

692,120

This type of presentation requires more thinking to get a grip on the data than it should. This is the kind of processing that the computer should be doing for you. For instance, the computer could make this easier on the end user by changing the raw figures into percentages.

Age Group

Percentage of Population

0-18

42%

18-35

39%

35-50

11%

50+

8%

 
Figure 1: This pie chart represents the data even more accessibly.

The percentages tell a better story. But understanding could be enhanced even further if the data were drawn as a pie-chart, as in Figure 1.

From the size of the slices on the pie, end users can more easily interpret the data and turn it into useful information.

But what happens when you’ve got a lot of data to visualize? Bar charts and scatter charts, while useful, are limited in the number of data points that they can render.

Making the Case for Advanced Visualization
What would happen if you wanted to view data from every country in the world, broken down in the same way? Would you have a page showing hundreds of pie charts? How would these pie charts relate to each other?

These are the problems that the treemap visualization has been designed to solve. The treemap allows you to render a complex, hierarchical dataset in a relational view. It is capable of plotting many data points and keeping it visually consistent. An example of a treemap in commercial use is SmartMoney.com’s Market Map, which takes the instruments that are in the S&P 500 index of stocks and creates a treemap.

On this treemap, the market is divided into sectors. Each sector has a number of stocks. The area of the sector is divided up into a number of rectangles with the size of the rectangle being directly proportional to the market cap of the company (the market cap is the number of shares available times the price of a share). The color of the rectangle shows the current change in price. Hovering over a rectangle shows more detail on the company in question.

As you can see, a vast amount of information is presented to the user:

  • Company placement by sector
  • Market cap of every company in the index
  • Current status of the stock (up/down) every company
  • Overall view of the market today
  • Overall view of every sector today

This is an incredibly useful tool. On any given day, you can easily see which sectors and companies are doing well, and which are doing badly.

In this article, you’ll use a similar visualization technique to build an application that renders whatever data you like.

Various Java Treemap Visualizations

 
Figure 2: This is the University of Maryland Treeview visualization.

The homepage of the original Treemap work is at Ben Schneidermann’s at the University of Maryland, and it may be found here. His implementation, which generates a treemap of the contents of a specific directory on your hard drive may be downloaded from this site. Figure 2 shows a screenshot of the output of this treemap.

In addition to this one there are a couple of excellent open source offerings available on www.sourceforge.net. This Java Treemap, for instance, provides some excellent options on how to present your treemap. A screenshot from this version is shown in Figure 3.

 
Figure 3: Here is the Java Treemap screen capture.

JTreemap is another available open source Treemap application. Though written in French, it’s very flexible and easy to use. In the sourcecode for this article, I have included a version of its XML instance document and schema translated into English, as well as one of the Java modules of the original download. If you aren’t comfortable with the French software, you can use these versions.

Building a Treemap Application with JTreemap
The JTreemap project makes it very simple to build a treemap. Indeed, if you structure your XML according to the DTD that is provided, the application will automatically render a treemap for you.

This XML format is very straightforward, and consists of a nested tree of data which the data item nodes containing a value, a weight and a label. An example of the XML is shown in the code below. The full XML document is available here.

            			  	  50	  2		.	.        			  	  300.0	  11.0			  	  22.0	  -5.0	      
 
Figure 4: This shows JTreemap’s visualization of population data.

Figure 4 shows what happens when the application is run with the above data. The visualization draws a treemap with boxes representing the size of the population of the country (specified using the ‘weight’ node), colors representing the delta of the population (specified using the ‘value’ node) and a label associated with the country (specified using the label node).

Visualization Equals Data Simplification
This method is an incredibly useful way of looking at data. It allows for a much better overview of complex data than you get with traditional visualizations. The JTreemap Applet provides an easy way to implement this technology. Use the basics you have gleaned here to explore the next level and add value to your data applications.

Share the Post:
Share on facebook
Share on twitter
Share on linkedin

Overview

The Latest

microsoft careers

Top Careers at Microsoft

Microsoft has gained its position as one of the top companies in the world, and Microsoft careers are flourishing. This multinational company is efficiently developing popular software and computers with other consumer electronics. It is a dream come true for so many people to acquire a high paid, high-prestige job

your company's audio

4 Areas of Your Company Where Your Audio Really Matters

Your company probably relies on audio more than you realize. Whether you’re creating a spoken text message to a colleague or giving a speech, you want your audio to shine. Otherwise, you could cause avoidable friction points and potentially hurt your brand reputation. For example, let’s say you create a

chrome os developer mode

How to Turn on Chrome OS Developer Mode

Google’s Chrome OS is a popular operating system that is widely used on Chromebooks and other devices. While it is designed to be simple and user-friendly, there are times when users may want to access additional features and functionality. One way to do this is by turning on Chrome OS