InfoVis:Wiki - User contributions [en]

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 3

2008-12-08T21:11:13Z

UE-InfoVis0809 0326850: Added linebreak at bibliography

== Aufgabenstellung ==
[http://ieg.ifs.tuwien.ac.at/~gschwand/teaching/infovis_ue_ws08/infovis_ue_aufgabe3.html Beschreibung der Aufgabe 3]

=== Zu beurteilende Grafik ===
[[Image:Sotpg6.jpg|400px]] 
Emissions in the US - Diff'rent smokes

== Evaluation ==

As it is written at the top of the graph the primary aim is to show that:
* pollution grows (through the size of the cube)
* immediately-hazardous pollution decreases (through the bars in the cube)
* CO2 emission increases (not recognizable at first sight)

Expressed in percent this statement is correct. Measured at the overall pollution it's incorrect because the total emission increases. But wheter this statement is true or not, our goal is to emphasize the author's message by improving his expression.

{{Quotation | In anything at all, perfection is finally attained not when there is no longer anything to add, but when there is no longer anything to take away. | '''[Antoine de Saint Exupery]'''}}

The data shall be highlighted to give them a voice that comes through loudly and clearly, without distraction. '''[Few, 2004a]''' This can be achieved by subtracting anything, that is not required to support the message and by emphasizing whats important. This leads us to the term of ''elgance''. Elegant comes from the Latin term ''eligere'' and means to choose out carefully. '''[Few, 2004a]''' In the following we want to evaluate the current graph by using a concept called ''data-ink ratio'' introduced by Edward R. Tufte in '''[Tufte, 1983]'''.

=== Data-Ink Ratio ===
Explained in a few words, the data-ink ratio is the proportion of ink which is used to present the actual data compared to the total amount of ink which is used in the entire graph. '''[Few, 2004b]''' The graph uses a lot of unnecessary ink - or pixels in this case - and therefore has a low data-ink ratio.

==== Reduce non-data ink ====
Every unnecessary non-data ink should be reduced to a minimum. The gray shading at the top can even be removed completely without loss of any data. Having a better representation of data, the written text at the top would become redundant and could also be removed or at least replaced with a few words to introduce the reader in the topic. The engraved text at the top of the cube, the year-digits at the top/left side of the cube and so on can be reduced or even removed.

==== Enhance the data ink ====
To emphasize the primary aim of showing up how emission of CO2 increases, the part of the cube which represents CO2 could be highlighted. In the current graph Carbon Monoxide seems to be very important and acts as an eye catcher - even though this was not intended by the author.

== Refactored Design ==
[[Image:co2_InfoVis.png]] 
Legend:
* DEPM - Directly Emited Particulate Matter
* SO2 - Sulfur Dioxide
* VOC - Volatile Organic Compound
* NO - Nitrogen Oxide
* CH4 - Methane
* CO - Carbon Monoxide
* Pb - Lead
* NH3 - Ammonia
* CO2 - Carbon Dioxide

== Applied Changes ==
=== Cube ===
'' cube graph '' 
First of all, we want to comment on the cube concept. Generally, we like this concept and think that it is relevant for the problem. However, it is misused in many ways. What is more, it is relative complex for this kind of data that can be presented in a much easier fashion.

'' matrix chart '' 
To solve this problem we used another type of graph. The Matrix (Bar)Chart.
Bar charts are widely used and easy to understand. In addition it is easier to see the (percentual) distribution of the data easier in the Bar-chart than the cube.

=== Bars ===
'' cube graph '' 
The data-ink ratio decreases through the 3 dimensional graph since there is much ink used that does not code any new data.

'' matrix chart '' 
2D bars are in this case better, because of their data-ink ratio. It is much greater that the data-ink ratio of the cube. What is more, there is no information loss. The reader can guess the relative amount of gas very fast by comparing the size of the bars or just look at the specific amount indicated by the numbers in(above) the bars for a concrete comparison.

=== Labels ===
'' cube graph '' 
There are no labels for the data for the years 1950 and 1980. So you have to guess the ratio of the different gases and you have to scroll all over the graph in order to see the representation of each bar, since there are labels only in the first cube.

'' matrix chart '' 
To solve this problem we added either an abbreviation or a chemical formula as a label in the matrix chart, since we expect that readers of this kind of graph will be most likely familiar with this terminology. Nevertheless, we added a legend in the wiki, so that the reader can easily see what the abbreviations mean.

=== Color ===
'' cube graph '' 
The color palette used is not appropriate. The colors are very bright and the reader concentrates mostly on the yellow bars. Because of the gray color of CO2 the reader assumes that this part of the cube is not important and as we know this is very wrong.

'' matrix chart '' 
To solve this problem we used a softer earth color for all the data, since we can say everything that we want with the size of the bars. Therefore, different colors are not needed in this case.

== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2008/09|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~gschwand/teaching/infovis_ue_ws08/ UE InfoVis]

* [[Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10|Gruppe 10]]

== Bibliography ==

[Few, 2004a] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten. Analytics Press, 2004, Chapter 7 - General Design for Communication.

[Few, 2004b] Stephen Few, Elegance Through Simplicity, United Business Media LLC. Created at: October 16, 2004. Retrieved at: December 7, 2008. http://www.intelligententerprise.com/showArticle.jhtml?articleID=49400920

[Tufte, 1983] Edward Tufte, ''The Visual Display of Quantitative Information.'' Graphics Press, 1983

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 3

2008-12-08T14:57:18Z

UE-InfoVis0809 0326850: Revised part of Evaluation

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 3

2008-12-08T11:58:11Z

UE-InfoVis0809 0326850: Added Evaluation

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 1 - Hyperbolic Tree

2008-11-07T16:29:25Z

UE-InfoVis0809 0326850: Bilder beschriftet

=Hyperbolic Tree=
[[Image:Hyperbolic_tree-focus_root.png|thumb|''Figure 1: Hyperbolic Tree with it's root focused [Garcia, 2008]'']]
[[Image:Hyperbolic tree-context.png|thumb|''Figure 2: Hyperbolic Tree with a focused child [Garcia, 2008]'']]

==Definition==
A Hyperbolic Tree is a fisheye representation of information in order to visualize huge amount of data.

==A mathematical point of view==
A Hyperbolic Tree, sometimes called a Hypertree, is a visualization method based on the hyperbolic geometry. In this geometry the parallel postulate of Euclidean geometry is replaced. That parallel postulate says, that for any given line '''l''' and any point '''P''' it can only exist exactly one line which does not intersect '''l''' and runs through '''P'''. This line is called a parallel line. In a hyperbolic space these two lines would diverge. '''[Wikipedia, 2008]''' Because of this characteristic the circumference grows exponentially as a function of the circle's radius. Similarly the number of leaves in a tree grow exponentially as a function of it's depth. '''[Wikipedia, 2008]'''

==Information visualization==
A Hyperbolic Tree is a concept which makes use of the properties discussed before. It can be classified as a focus + context technique. Only a small number of data is shown on the most expansive area in and near the center. Information in this area is stretched and is the part where the focus is caught. The peripheral area of the circle is used for all other nodes - the context. Information in this part is "squeezed". '''[Pirolli et al, 2003]''' Generally a hypertree is known as a "fisheye representation of information".

==User interaction==
The root-node is placed in the center of the circle. ''[Figure 1]'' Child nodes are positioned in other fictive concentric circles. Users can click within the tree to focus the desired area. As a result the user might be presented with something like that shown in ''[Figure 2]''. Typically the part of bringing other nodes into focus, the user is shown a smooth transformation of the display. '''[Pirolli et al, 2003; Huang and Quan, 2004]'''

==Comparison==
Compared to other conventional tree browsers, the hyperbolic tree shows all of the information at once, where other techniques force the user to scroll. For this reason it could be expected, that browsing performance will increase. The answer is both yes and no. In retrieval tasks, where users simply search for specific nodes, the performance is very good. It is fuerthermore increased through strong practice effects. In comparison tasks, where users have access to nodes in different parts of the tree to compare information. In this task a Hyperbolic tree cannot aim any advantage. On tasks with poor information scent cues, tests can end up with loss of efficiency. '''[Pirolli et al, 2003]''' Other limitations in navigation efficiency occur for trees with a large number of children. Also the concept of focus+context can be lost in specific situations where the "context-part" is pushed in any corner and therefore meaningless. '''[Huang and Quan, 2004]'''

==Bibliography==
'''[Wikipedia, 2008]''' Wikipedia contributors, Hyperbolic Tree, ''Wikipedia, The Free Encyclopedia.'', Retrieved at: November, 6 2008. http://en.wikipedia.org/wiki/Hyperbolic_tree

'''[Wikipedia, 2008]''' Wikipedia contributors, Hyperbolic Geometry, ''Wikipedia, The Free Encyclopedia.'', Retrieved at: November, 6 2008. http://en.wikipedia.org/wiki/Hyperbolic_geometry

'''[Pirolli et al, 2003]''' Peter Pirolli and Stuart K. Card and Mija M. Van Der Wege, The effects of information scent on visual search in the hyperbolic tree browser in ''ACM Trans. Comput.-Hum. Interact.'', pages 20-53, 2003, ACM

'''[Huang and Quan, 2004]''' Mao Lin Huang and Wu Quan, 21DF-browser: a multiple fisheye distortion technique for visualizing and navigating hierarchies with large number of leaves, In ''Information Visualisation, 2004. IV 2004. Proceedings. Eighth International Conference on'', pages 277-284, July 2004

'''[Garcia, 2008]''' Nicolas Garcia, JavaScript Information Visualization, Retrieved at: November, 6 2008. http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html<ref>Colors were changed, inverted to suit wiki better</ref>

==Footnotes and references==
<references/>

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 1 - Hyperbolic Tree

2008-11-07T16:19:37Z

UE-InfoVis0809 0326850:

=Hyperbolic Tree=
[[Image:Hyperbolic_tree-focus_root.png|thumb|''Picture 1'']]
[[Image:Hyperbolic tree-context.png|thumb|''Picture 2'']]

==Definition==
A Hyperbolic Tree is a fisheye representation of information in order to visualize huge amount of data.

==A mathematical point of view==
A Hyperbolic Tree, sometimes called a Hypertree, is a visualization method based on the hyperbolic geometry. In this geometry the parallel postulate of Euclidean geometry is replaced. That parallel postulate says, that for any given line '''l''' and any point '''P''' it can only exist exactly one line which does not intersect '''l''' and runs through '''P'''. This line is called a parallel line. In a hyperbolic space these two lines would diverge. '''[Wikipedia, 2008]''' Because of this characteristic the circumference grows exponentially as a function of the circle's radius. Similarly the number of leaves in a tree grow exponentially as a function of it's depth. '''[Wikipedia, 2008]'''

==Information visualization==
A Hyperbolic Tree is a concept which makes use of the properties discussed before. It can be classified as a focus + context technique. Only a small number of data is shown on the most expansive area in and near the center. Information in this area is stretched and is the part where the focus is caught. The peripheral area of the circle is used for all other nodes - the context. Information in this part is "squeezed". '''[Pirolli et al, 2003]''' Generally a hypertree is known as a "fisheye representation of information".

==User interaction==
The root-node is placed in the center of the circle. ''[Picture 1]'' Child nodes are positioned in other fictive concentric circles. Users can click within the tree to focus the desired area. As a result the user might be presented with something like that shown in ''[Picture 2]''. Typically the part of bringing other nodes into focus, the user is shown a smooth transformation of the display. '''[Pirolli et al, 2003; Huang and Quan, 2004]'''

==Comparison==
Compared to other conventional tree browsers, the hyperbolic tree shows all of the information at once, where other techniques force the user to scroll. For this reason it could be expected, that browsing performance will increase. The answer is both yes and no. In retrieval tasks, where users simply search for specific nodes, the performance is very good. It is fuerthermore increased through strong practice effects. In comparison tasks, where users have access to nodes in different parts of the tree to compare information. In this task a Hyperbolic tree cannot aim any advantage. On tasks with poor information scent cues, tests can end up with loss of efficiency. '''[Pirolli et al, 2003]''' Other limitations in navigation efficiency occur for trees with a large number of children. Also the concept of focus+context can be lost in specific situations where the "context-part" is pushed in any corner and therefore meaningless. '''[Huang and Quan, 2004]'''

==Bibliography==
'''[Wikipedia, 2008]''' Wikipedia contributors, Hyperbolic Tree, ''Wikipedia, The Free Encyclopedia.'', Retrieved at: November, 6 2008. http://en.wikipedia.org/wiki/Hyperbolic_tree

'''[Wikipedia, 2008]''' Wikipedia contributors, Hyperbolic Geometry, ''Wikipedia, The Free Encyclopedia.'', Retrieved at: November, 6 2008. http://en.wikipedia.org/wiki/Hyperbolic_geometry

'''[Pirolli et al, 2003]''' Peter Pirolli and Stuart K. Card and Mija M. Van Der Wege, The effects of information scent on visual search in the hyperbolic tree browser in ''ACM Trans. Comput.-Hum. Interact.'', pages 20-53, 2003, ACM

'''[Huang and Quan, 2004]''' Mao Lin Huang and Wu Quan, 21DF-browser: a multiple fisheye distortion technique for visualizing and navigating hierarchies with large number of leaves, In ''Information Visualisation, 2004. IV 2004. Proceedings. Eighth International Conference on'', pages 277-284, July 2004

'''[Garcia, 2008]''' Nicolas Garcia, JavaScript Information Visualization, Retrieved at: November, 6 2008. http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html<ref>Colors were changed, inverted to suit wiki better</ref>

==Footnotes and references==
<references/>

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 1 - Hyperbolic Tree

2008-11-07T14:16:23Z

UE-InfoVis0809 0326850: richtig zitiert

=Hyperbolic Tree=
[[Image:Hyperbolic_tree-focus_root.png|thumb|''Picture 1'']]
[[Image:Hyperbolic tree-context.png|thumb|''Picture 2'']]

==Definition==
A Hyperbolic Tree is a fisheye representation of information in order to visualize huge amount of data.

==A mathematical point of view==
A Hyperbolic Tree, sometimes called a Hypertree, is a visualization method based on the hyperbolic geometry. In this geometry the parallel postulate of Euclidean geometry is replaced. That parallel postulate says, that for any given line '''l''' and any point '''P''' it can only exist exactly one line which does not intersect '''l''' and runs through '''P'''. This line is called a parallel line. In a hyperbolic space these two lines would diverge. '''[wiki, 2008]''' Because of this characteristic the circumference grows exponentially as a function of the circle's radius. Similarly the number of leaves in a tree grow exponentially as a function of it's depth. '''[wiki, 2008]'''

==Information visualization==
A Hyperbolic Tree is a concept which makes use of the properties discussed before. It can be classified as a focus + context technique. Only a small number of data is shown on the most expansive area in and near the center. Information in this area is stretched and is the part where the focus is caught. The peripheral area of the circle is used for all other nodes - the context. Information in this part is "squeezed". '''[Pirolli et al, 2003]''' Generally a hypertree is known as a "fisheye representation of information".

==User interaction==
The root-node is placed in the center of the circle. ''[Picture 1]'' Child nodes are positioned in other fictive concentric circles. Users can click within the tree to focus the desired area. As a result the user might be presented with something like that shown in ''[Picture 2]''. Typically the part of bringing other nodes into focus, the user is shown a smooth transformation of the display. '''[Pirolli et al, 2003; Huang and Quan, 2004]'''

==Comparison==
Compared to other conventional tree browsers, the hyperbolic tree shows all of the information at once, where other techniques force the user to scroll. For this reason it could be expected, that browsing performance will increase. The answer is both yes and no. In retrieval tasks, where users simply search for specific nodes, the performance is very good. It is fuerthermore increased through strong practice effects. In comparison tasks, where users have access to nodes in different parts of the tree to compare information. In this task a Hyperbolic tree cannot aim any advantage. On tasks with poor information scent cues, tests can end up with loss of efficiency. '''[Pirolli et al, 2003]''' Other limitations in navigation efficiency occur for trees with a large number of children. Also the concept of focus+context can be lost in specific situations where the "context-part" is pushed in any corner and therefore meaningless. '''[Huang and Quan, 2004]'''

==Bibliography==
'''[wiki, 2008]''' Wikipedia contributors, Hyperbolic Tree, ''Wikipedia, The Free Encyclopedia.'', Retrieved at: November, 6 2008. http://en.wikipedia.org/wiki/Hyperbolic_tree

'''[wiki, 2008]''' Wikipedia contributors, Hyperbolic Geometry, ''Wikipedia, The Free Encyclopedia.'', Retrieved at: November, 6 2008. http://en.wikipedia.org/wiki/Hyperbolic_geometry

'''[Pirolli et al, 2003]''' Peter Pirolli and Stuart K. Card and Mija M. Van Der Wege, The effects of information scent on visual search in the hyperbolic tree browser in ''ACM Trans. Comput.-Hum. Interact.'', pages 20-53, 2003, ACM

'''[Huang and Quan, 2004]''' Mao Lin Huang and Wu Quan, 21DF-browser: a multiple fisheye distortion technique for visualizing and navigating hierarchies with large number of leaves, In ''Information Visualisation, 2004. IV 2004. Proceedings. Eighth International Conference on'', pages 277-284, July 2004

'''[Garcia, 2008]''' Nicolas Garcia, JavaScript Information Visualization, Retrieved at: November, 6 2008. http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html<ref>Colors were changed, inverted to suit wiki better</ref>

==Footnotes and references==
<references/>

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 1 - Hyperbolic Tree

2008-11-07T13:22:02Z

UE-InfoVis0809 0326850:

=Hyperbolic Tree=
[[Image:Hyperbolic_tree-focus_root.png|thumb|''Picture 1'']]
[[Image:Hyperbolic tree-context.png|thumb|''Picture 2'']]

==Definition==
A Hyperbolic Tree is a "'fisheye representation of information'" in order to visualize huge amount of data.

==A mathematical point of view==
A Hyperbolic Tree, sometimes called a Hypertree, is a visualization method based on the hyperbolic geometry. In this geometry the parallel postulate of Euclidean geometry is replaced. That parallel postulate says, that for any given line '''l''' and any point '''P''' it can only exist exactly one line which does not intersect '''l''' and runs through '''P'''. This line is called a parallel line. In a hyperbolic space these two lines would diverge. '''[wiki 2]''' Because of this characteristic the circumference grows exponentially as a function of the circle's radius. Similarly the number of leafs/leaves in a tree grow exponentially as a function of it's depth. '''[wiki 1]'''

==Information visualization==
A Hyperbolic Tree is a concept which makes use of the properties discussed before. It can be classified as a focus + context technique. Only a small number of data is shown on the most expansive area in and near the center. Information in this area is stretched and is the part where the focus is caught. The peripheral area of the circle is used for all other nodes - the context. Information in this part is "squeezed". '''[Pirolli et al, 2003]''' Generally a hypertree is known as a "fisheye representation of information".

==User interaction==
The root-node is placed in the center of the circle. ''[Picture 1]'' Child nodes are positioned in other fictive concentric circles. Users can click within the tree to focus the desired area. As a result the user might be presented with something like that shown in ''[Picture 2]''. Typically the part of bringing other nodes into focus, the user is shown a smooth transformation of the display. '''[Pirolli et al, 2003]''', '''[Huang et al, 2004]'''

==Comparison==
Compared to other conventional tree browsers, the hyperbolic tree shows all of the information at once, where other techniques force the user to scroll. For this reason it could be expected, that browsing performance will increase. The answer is both yes and no. In retrieval tasks, where users simply search for specific nodes, the performance is very good. It is fuerthermore increased through strong practice effects. In comparison tasks, where users have access to nodes in different parts of the tree to compare information. In this task a Hyperbolic tree cannot aim any advantage. On tasks with poor information scent cues, tests can end up with loss of efficiency. '''[Pirolli et al, 2003]''' Other limitations in navigation efficiency occur for trees with a large number of children. Also the concept of focus+context can be lost in specific situations where the "context-part" is pushed in any corner and therefore meaningless. '''[Huang et al, 2004]'''

==Bibliography==
'''[wiki 1]''' X, Hyperbolic Tree, Y, 2008.6.11, http://en.wikipedia.org/wiki/Hyperbolic_tree

'''[wiki 2]''' Z, Hyperbolic Geometry, U, 2008.6.11, http://en.wikipedia.org/wiki/Hyperbolic_geometry

'''[Pirolli et al, 2003]''' Peter Pirolli and Stuart K. Card and Mija M. Van Der Wege, The effects of information scent on visual search in the hyperbolic tree browser in ''ACM Trans. Comput.-Hum. Interact.'', pages 20-53, 2003, ACM

'''[Huang et al, 2004]''' Mao Lin Huang and Wu Quan, 21DF-browser: a multiple fisheye distortion technique for visualizing and navigating hierarchies with large number of leaves, pages 277-284, 2004

'''[pic]''' X, Y, 2008.6.11, http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html<ref>Colors were changed, inverted to suit wiki better</ref>

==Footnotes and references==
<references/>

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 1 - Hyperbolic Tree

2008-11-07T13:11:57Z

UE-InfoVis0809 0326850:

=Hyperbolic Tree=
[[Image:Hyperbolic_tree-focus_root.png|thumb|''Picture 1'']]
[[Image:Hyperbolic tree-context.png|thumb|''Picture 2'']]

==Definition==
A Hyperbolic Tree is a "'fisheye representation of information'" in order to visualize huge amount of data.

==A mathematical point of view==
A Hyperbolic Tree, sometimes called a Hypertree, is a visualization method based on the hyperbolic geometry. In this geometry the parallel postulate of Euclidean geometry is replaced. That parallel postulate says, that for any given line '''l''' and any point '''P''' it can only exist exactly one line which does not intersect '''l''' and runs through '''P'''. This line is called a parallel line. In a hyperbolic space these two lines would diverge. '''[wiki 2]''' Because of this characteristic the circumference grows exponentially as a function of the circle's radius. Similarly the number of leafs/leaves in a tree grow exponentially as a function of it's depth. '''[wiki 1]'''

==Information visualization==
A Hyperbolic Tree is a concept which makes use of the properties discussed before. It can be classified as a focus + context technique. Only a small number of data is shown on the most expansive area in and near the center. Information in this area is stretched and is the part where the focus is caught. The peripheral area of the circle is used for all other nodes - the context. Information in this part is "squeezed". '''[Pirolli et al, 2003]''' Generally a hypertree is known as a "fisheye representation of information".

==User interaction==
The root-node is placed in the center of the circle. ''[Picture 1]'' Child nodes are positioned in other fictive concentric circles. Users can click within the tree to focus the desired area. As a result the user might be presented with something like that shown in ''[Picture 2]''. Typically the part of bringing other nodes into focus, the user is shown a smooth transformation of the display. '''[Pirolli et al, 2003]''', '''[Huang et al, 2004]'''

==Comparison==
Compared to other conventional tree browsers, the hyperbolic tree shows all of the information at once, where other techniques force the user to scroll. For this reason it could be expected, that browsing performance will increase. The answer is both yes and no. In retrieval tasks, where users simply search for specific nodes, the performance is very good. It is fuerthermore increased through strong practice effects. In comparison tasks, where users have access to nodes in different parts of the tree to compare information. In this task a Hyperbolic tree cannot aim any advantage. On tasks with poor information scent cues, tests can end up with loss of efficiency. '''[Pirolli et al, 2003]''' Other limitations in navigation efficiency occur for trees with a large number of children. Also the concept of focus+context can be lost in specific situations where the "context-part" is pushed in any corner and therefore meaningless. '''[Huang et al, 2004]'''

==Bibliography==
'''[wiki 1]''' X, Hyperbolic Tree, Y, 2008.6.11, http://en.wikipedia.org/wiki/Hyperbolic_tree
'''[wiki 2]''' Z, Hyperbolic Geometry, U, 2008.6.11, http://en.wikipedia.org/wiki/Hyperbolic_geometry

'''[Pirolli et al, 2003]''' Peter Pirolli and Stuart K. Card and Mija M. Van Der Wege, The effects of information scent on visual search in the hyperbolic tree browser in ''ACM Trans. Comput.-Hum. Interact.'', pages 20-53, 2003, ACM

'''[Huang et al, 2004]''' Mao Lin Huang and Wu Quan, 21DF-browser: a multiple fisheye distortion technique for visualizing and navigating hierarchies with large number of leaves, pages 277-284, 2004

'''[pic]''' X, Y, 2008.6.11, http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html<ref>Colors were changed, inverted to suit wiki better</ref>

==Footnotes and references==
<references/>

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 1 - Hyperbolic Tree

2008-11-07T12:49:35Z

UE-InfoVis0809 0326850:

=Hyperbolic Tree=
[[Image:Hyperbolic_tree-focus_root.png|thumb|''Picture 1'']]
[[Image:Hyperbolic tree-context.png|thumb|''Picture 2'']]

==Definition==
A Hyperbolic Tree is a "'fisheye representation of information'" in order to visualize huge amount of data.

==A mathematical point of view==
A Hyperbolic Tree, sometimes called a Hypertree, is a visualization method based on the hyperbolic geometry. In this geometry the parallel postulate of Euclidean geometry is replaced. That parallel postulate says, that for any given line '''l''' and any point '''P''' it can only exist exactly one line which does not intersect '''l''' and runs through '''P'''. This line is called a parallel line. In a hyperbolic space these two lines would diverge. '''[wiki 2]''' Because of this characteristic the circumference grows exponentially as a function of the circle's radius. Similarly the number of leafs/leaves in a tree grow exponentially as a function of it's depth. '''[wiki 1]'''

==Information visualization==
A Hyperbolic Tree is a concept which makes use of the properties discussed before. It can be classified as a focus + context technique. Only a small number of data is shown on the most expansive area in and near the center. Information in this area is stretched and is the part where the focus is caught. The peripheral area of the circle is used for all other nodes - the context. Information in this part is "squeezed". '''[Pirolli et al, 2003]''' Generally a hypertree is known as a "fisheye representation of information".

==User interaction==
The root-node is placed in the center of the circle. ''[Picture 1]'' Child nodes are positioned in other fictive concentric circles. Users can click within the tree to focus the desired area. As a result the user might be presented with something like that shown in ''[Picture 2]''.

==Comparison==
Compared to other conventional tree browsers, the hyperbolic tree shows all of the information at once, where other techniques force the user to scroll. For this reason it could be expected, that browsing performance will increase. The answer is both yes and no. In retrieval tasks, where users simply search for specific nodes, the performance is very good. It is fuerthermore increased through strong practice effects. In comparison tasks, where users have access to nodes in different parts of the tree to compare information. In this task a Hyperbolic tree cannot aim any advantage. On tasks with poor information scent cues, tests can end up with loss of efficiency. '''[Pirolli et al, 2003]'''

==Bibliography==
'''[wiki 1]''' X, Hyperbolic Tree, Y, 2008.6.11, http://en.wikipedia.org/wiki/Hyperbolic_tree
'''[wiki 2]''' Z, Hyperbolic Geometry, U, 2008.6.11, http://en.wikipedia.org/wiki/Hyperbolic_geometry

'''[Pirolli et al, 2003]''' Peter Pirolli and Stuart K. Card and Mija M. Van Der Wege, The effects of information scent on visual search in the hyperbolic tree browser in ''ACM Trans. Comput.-Hum. Interact.'', pages 20-53, 2003, ACM

'''[pic]''' X, Y, 2008.6.11, http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html<ref>Colors were changed, inverted to suit wiki better</ref>

==Footnotes and references==
<references/>

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 1 - Hyperbolic Tree

2008-11-07T09:45:51Z

UE-InfoVis0809 0326850: New page: Unformatierte Rohfassung zur weiteren Bearbeitung... <A mathematical point of view> A Hyperbolic Tree, sometimes called a Hypertree, is a visualization method based on the hyperbolic geo...

Unformatierte Rohfassung zur weiteren Bearbeitung...

<A mathematical point of view>
A Hyperbolic Tree, sometimes called a Hypertree, is a visualization method based on the hyperbolic geometry. In this geometry the parallel postulate of Euclidean geometry is replaced. That parallel postulate says, that for any given line l and any point P it can only exist exactly one line which does not intersect l and runs through P. This line is called a parallel line. In a hyperbolic space this two lines would diverge. [wiki2] Because of this characteristic the circumference grows exponentially as a function of the circle's radius. Similarly the number of leafs in a tree grow exponentially as a function of it's depth. [wiki1]

<Information visualization>
A Hyperbolic Tree then is a concept which makes use of the properties discussed before. It can be classified as a focus + context technique. Only a small number of data is shown on the most expensive area in and near the center. Information in this area is stretched and is the part where the focus is catched. The peripheral area of the circle is used for all other nodes - the context. Information in this part is squeezed. [pdf] Generally a Hypertree is known as a fisheye representation of information.

<User interaction>
The root-node is placed in the center of the circle. [See picture 1] Child nodes are positioned in other fictive concentric circles. Users can click within the tree to focus the desired area. As a result the user might get something like shown in [picture 2].

<Comparison>
Compared to other conventional tree browsers, the Hyperbolic tree shows all of the information at once, where other techniques force the user to scroll. For this reason it could be expected, that browsing performance will increase. The answer is both, yes and no. In retrieval tasks where users simply require to find specific nodes the performance is much better. And it grows additionally with strong practice effects. In comparison tasks users have to access nodes in different parts of the tree to compare information. In this task a Hyperbolic tree cannot aim any advantage. On tasks with poor information scent cues, tests can end up with loss of efficiency. [pdf]

Quellen:

[wiki1] http://en.wikipedia.org/wiki/Hyperbolic_tree
[wiki2] http://en.wikipedia.org/wiki/Hyperbolic_geometry

[pdf]
Bibtex:
@article{606660,
author = {Peter Pirolli and Stuart K. Card and Mija M. Van Der Wege},
title = {The effects of information scent on visual search in the hyperbolic tree browser},
journal = {ACM Trans. Comput.-Hum. Interact.},
volume = {10},
number = {1},
year = {2003},
issn = {1073-0516},
pages = {20--53},
doi = {http://doi.acm.org/10.1145/606658.606660},
publisher = {ACM},
address = {New York, NY, USA},
}

Bildquellen:
http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html
Farben angepasst - invertiert um es schöner ins Dokument integrieren zu können.

Verlinkte Bilder:
[picture 1]
[[Image:Hyperbolic_tree-focus_root.png]]
[picture 2
[[Image:Hyperbolic tree-context.png]]

File:Hyperbolic tree-context.png

2008-11-07T09:43:02Z

UE-InfoVis0809 0326850: New page: == Beschreibung == == Copyright status == == Source == http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html

== Beschreibung ==

== Copyright status ==

== Source ==
http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html

File:Hyperbolic tree-focus root.png

2008-11-07T09:36:16Z

UE-InfoVis0809 0326850: New page: == Beschreibung == == Copyright status == == Source == http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html

== Beschreibung ==

== Copyright status ==

== Source ==
http://blog.thejit.org/wp-content/jit-1.0a/examples/hypertree.html

Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10

2008-10-27T13:29:04Z

UE-InfoVis0809 0326850:

==Gruppenmitglieder==
*[[User:UE-InfoVis0809_0427571|Debong, Fredrik]]
*[[User:UE-InfoVis0809_0326850|Fischl, Christian]]
*[[User:UE-InfoVis0809_0508142|Petrov, Peter]]

==Aufgaben==
*[[Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 1|Aufgabe 1]]
*[[Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 2|Aufgabe 2]]
*[[Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 3|Aufgabe 3]]
*[[Teaching:TUW - UE InfoVis WS 2008/09 - Gruppe 10 - Aufgabe 4|Aufgabe 4]]

User:UE-InfoVis0809 0326850

2008-10-27T13:26:30Z

UE-InfoVis0809 0326850: New page: ===Christian Fischl=== thumb *Name: '''Christian Fischl''' *Matrikelnummer: '''0326850''' *Studienkennzahl: '''066 935''' *eMail: '''christian.fischl (at) student.t...

===Christian Fischl===

[[Image:chrisi.jpg|thumb]]

*Name: '''Christian Fischl'''
*Matrikelnummer: '''0326850'''
*Studienkennzahl: '''066 935'''
*eMail: '''christian.fischl (at) student.tuwien.ac.at'''
*Gruppe: '''[[Teaching:TUW_-_UE_InfoVis_WS_2008/09_-_Gruppe_10|10]]'''

File:Chrisi.jpg

2008-10-27T13:15:19Z

UE-InfoVis0809 0326850: Christian Fischl

== Beschreibung ==
Christian Fischl
== Copyright status ==

== Source ==