Difference between revisions of "Talk:Lesson05"

From Visual Analytics for Business Intelligence
Jump to navigation Jump to search
(Created page with "==10 Lessons in Treemap Design== This article really strikes me. I have to disagree with some of the treemap designs that the author has stated in the treemap. For the 2nd poi...")
 
Line 5: Line 5:
  
 
-Ong Ming Hao
 
-Ong Ming Hao
 +
 +
 +
 +
==Treemap in D3==
 +
The following blog shows how treemap is done by D3. The cool thing about this web is that the treemap on the web is as interactive as the tree map in Tableau. In addition, the transition between selections is amazing, showing the resizing of the boxes.
 +
http://bl.ocks.org/tgk/6044254
 +
Thinking that this might be useful for some of our projects.
 +
Treemap is definitely a powerful analytical technique. However, initially it striked me as too complicated. Only after listening to prof., I started to realize the power of it. Nevertheless, without much previous experience and interactions, users might just be confused.
 +
Hence, when we intend to use such a powerful tool, keep in mind to add legend explaining what represents which. For instance, the bigger the size, the larger the sale. And the darker the color, the higher the price. Tableau seems to miss out the size legend.
 +
Here is an example of how NYTimes defines the meaning of the box size as well as the color of its treemap. http://www.nytimes.com/interactive/2008/09/15/business/20080916-treemap-graphic.html
 +
 +
-Nguyen Duy Loc

Revision as of 20:36, 8 September 2016

10 Lessons in Treemap Design

This article really strikes me. I have to disagree with some of the treemap designs that the author has stated in the treemap. For the 2nd point where he stated that space matters, the author stated that having category would distort labelling. I disagree with the author, and further think that It would in fact aid the user. The picture illustration that he gave shows a white borders to group a category together. The picture actually gave me a clearer indication of the various groups and do not distort the sizes. This was due to the (different coloured) borders showing me a clear indication of the different groups. Another example of a good use of spacing between the various categories is a graphic made by the New York Times. http://www.nytimes.com/imagepages/2007/02/25/business/20070225_CHRYSLER_GRAPHIC.html

For the 4th point, the author stated that the labels must stand-out against treemap colours. This statement is dependent on the colours and how the labels are used. Even if you use colours that would contrast with the treemap colours and the labels. If everything is cluttered as shown in the example, it would still make the diagram look messy and undesirable. Lastly, creating a glow around the label as stated by the author may not always work.

-Ong Ming Hao


Treemap in D3

The following blog shows how treemap is done by D3. The cool thing about this web is that the treemap on the web is as interactive as the tree map in Tableau. In addition, the transition between selections is amazing, showing the resizing of the boxes. http://bl.ocks.org/tgk/6044254 Thinking that this might be useful for some of our projects. Treemap is definitely a powerful analytical technique. However, initially it striked me as too complicated. Only after listening to prof., I started to realize the power of it. Nevertheless, without much previous experience and interactions, users might just be confused. Hence, when we intend to use such a powerful tool, keep in mind to add legend explaining what represents which. For instance, the bigger the size, the larger the sale. And the darker the color, the higher the price. Tableau seems to miss out the size legend. Here is an example of how NYTimes defines the meaning of the box size as well as the color of its treemap. http://www.nytimes.com/interactive/2008/09/15/business/20080916-treemap-graphic.html

-Nguyen Duy Loc