Information visualisation
This article/section is a stub — probably a pile of half-sorted notes, is not well-checked so may have incorrect bits. (Feel free to ignore, or tell me) |
Contents
Snippets of theory
The following are some common channels that information can be encoded into.
- Position
- Color
- Shape
- Motion
- Scale (in one, two, or three dimensions at once).
- Orientation
- Color
In some way these are dimensions of representation, but they are hardly orthogonal for our sensory system, so this doesn't in any way mean you can just represent eight-dimensional data at will. Also, further down the list, the actual variations are discerned less automatically, so your usual picks will be two or three from the top of this list.
You should probably know about Gestalt psychology to avoid and exploit specific effects.
Diagrams (types, examples)
Statistics charting: bar graphs, pies, some surfaces, etc.
Proportions
Bullet graph
Like a mix between a bar graph, gauge, and progress bar, but compact and with with a comparison.
http://en.wikipedia.org/wiki/Bullet_graph
Treemaps
Primarily shows proportions. Covers a given area with the relative sizes of the elements in a tree - usually using rectangles.
Can also handle hierarchical data, by walking into nodes and dividing its elements as well, making for nested rectangles. (though this can easily become messy)
Gives a good overview of proportions of many items, and is information dense in that it doesn't waste space.
They tend to be easiest to read and grasp for at most a few levels and/or at most a few dozen items.
There are many ways to layout a particular data set while keeping the proportional relationships.
There are a handful of basic approaches, and more variations of lower-level decision logic, and specific-purpose variations.
Each style has its own qualities in terms of:
- visibility of order (of relative sizes, or potentially of something else) present in the data
- layout stability under small changes
- ease of labeling (e.g. vertical strips work well)
- squareness of items - the aspect ratio being near 1. This tends to looks nicer, is more easily comparable than e.g. thin strips are to each other
Some of these seem to be tradeoffs - in particular orderedness and aspect squareness. Implies is that there is no algorithm that is known to be optimal.
Some algorithms are O(n2) with the amount of nodes, largely because they look ahead in the list of nodes.
Most can be executed in a simple shallow-to-deep recursive, way. In other words, with no interaction between layers beyond giving the deeper level a boundary to work in.
Layout variants:
- Slice & Dice treemaps:
- ordered, little attention to aspect ratio (typically thin slices), good stability
- Strip(verify):
- ordered, some attention to aspect ratio, medium stability
- http://www.infovis-wiki.net/index.php/Treemap
- Squarified treemaps:
- Pivot
- order, some attention to aspect ratio, medium stability
- Split
- Named by Ordered and Unordered Treemap Algorithms and Their Implications on Handheld Devices
- order, some attention to aspect ratio
....and some fancier variants:
- Circular treemaps:
- Font 004 - Community
- Jigsaw Treemaps
- shifts a little in the direction of more general space-filling visualizations
- jigsaw reemap
- http://www.research.ibm.com/visual/papers/158-wattenberg-final3.pdf
- Convex Treemaps
- convex treemap
- refers to various experiments related to shape (and implied algorithm changes), including:
- rectangle/triangle cuts,
- Voronoi treemaps, e.g. [2]
See also:
- http://www.cs.umd.edu/hcil/treemap-history/
- http://www.cs.umd.edu/hcil/treemap-history/java_algorithms/LayoutApplet.html
- http://smartdatacollective.com/Home/16512
Sunburst
Sunburst diagram/tree
Other
Clouds:
- Many examples out there
- http://jevbratt.com/skr/description_e.html
Fun:
Hierarchy
Trees
Basic trees:
- well. Many, many things out there.
Alternate views:
Dendrogram/phylogram/cladogram:
- horizontal/vertical
- unrooted trees
- radial trees (regularly unrooted)
- e.g. Tree of Life
Radial views
Radial/pie trees/hierarchy/connectivity (moving into (nested) graphs):
- Examples, some hybrid:
Connectivity
Graph as in nodes 'n' edges
Offline drawing (some interactive):
- IsaViz (for RDF)
Web-based (some interactive):
- Graph Gear
- SpringGraph (Flash, specifically Flex)
- http://sawamuland.com/flash/graph.html
- TouchGraph (Java applet) (now a company; only the old version is open source)
- hypergraph (Java applet)
- JUNG (Java applet)
- Interactive Graph Drawing (Java applet)
- RDF Gravity (Java)
- three for all (prefuse; see below)
Specific/example applications:
- http://www.stanford.edu/group/sonia/
- visuwords online visual dictionary
- musicovery visual jukebox
- visual music recommendation
- Citegraph
- Visual Boom
- Genealogy Motion Graphics
- TuneGlue
- Visualising Multiple Overlapping Classification Hierarchies
- Diagram-geared:
- yEd (graph editor)
- JGraph (diagrams and such)
- OmniGraffle (Mac)
- NodeBox (Mac)
- Welkin
Arcs
Tend to be useful for graph data that is rather hierarchical, and not too dense
Flow
Sankey diagram:
- Sankey diagram (wikipedia article)
- Interactive Sankey diagrams
Chonology
Events over time:
Proportions over time:
- Sparklines
- http://infosthetics.com/archives/2007/03/detailed_digg_scatterplots.html
- http://infosthetics.com/archives/2007/02/bigspy_digg_visualization.html
Some alternative views:
- http://lip.sourceforge.net/calendars/calendar.php?year=2007
- http://infosthetics.com/archives/2006/12/information_esthetics_calendar.html
- http://infosthetics.com/archives/2006/12/creative_calendar_design.html
Geography / spatial
Geographical:
- Travel-time Maps
- Travel time tube map
- cartographic flow map layout
- world blogosphere screensaver
- live stats on a 3D globe
- locative disposition
- WorldMapper
- http://www.earthalbum.com/usa
Spatial / psuedo-geographical:
Related libraries:
Some alternatives:
Wider analysis/visualization
Visualization:
- Improvise
- InfoVis Toolkit (Java)
- Prefuse (Java applets)
- Piccolo (Java/C#, interactive)
- Visualization Toolkit (VTK) (C++)
- MayaVi (Python, Tkinter GUI)
- Processing (Java) (not directly/only visualization, but programmable)
- Improvise (Java) (see examples)
General dataset apps:
- http://exsitewebware.com/extrema/index.html
- IBM OpenDX
- http://www.paraview.org/HTML/Index.html ParaView
- http://services.alphaworks.ibm.com/manyeyes/home (online)
Statistics:
Web-based:
- flare (flash)
Software
Libraries
And/or things that can output images:
- ploticus (script interface, C library)
- gnuplot (script interface), see also Gnuplot notes
- rrdtool's graphing. See also MRTG (Networking notes) and system admin apps based on it (Linux admin notes).
- dislin (C/Fortran) (see also disipyl, a python wrapper)
- matplotlib (Python, see also notes at Numpy, scipy, matplotlib, pylab)
- Gruff (Ruby)
- JFreeChart (Java)
- jCharts (Java)
- ZedGraph (.NET)
Web-based
Seemingly the nicest options (no server dependencies or only light server dependencies, and also fairly pretty):
- ChartJS (javascript, responsive)
- chartist (javascript, responsive)
- Plotr (javascript (Prototype), free, open source)
- PlotKit (apparently obsoletes CanvasGraph) (javascript (for Mochikit), free, open source)
- flot (javascript (jQuery), free, open source)
- jqPlot (javascript (jQuery), free, open source)
- Google Chart API (generated from google's servers from request data. free, but with daily limit (that you can usually solve by caching results))
- jquery.Sparklines (javascript (for jQuery))
- JavaScript InfoVis Toolkit (javascript, free, open source)
Web services:
- plotly (javascript/python/R/matlab APIs, free version and paid versions, mostly online but can be used offline)
Also useful in certain cases:
- open flash chart (flash, free, open source)
- EJSChart (javascript, paid-for)
- See also lists like http://cssjuice.com/22-code-snippets-for-creating-decent-charts/
- PHP/SWF Charts (Flash, paid for, has free version)
- amCharts (Flash, paid for, has free version)
- FusionCharts (Flash, paid for)
- Flex Charting (Flash, paid for)
- Big Faceless Java Graph Library (java, paid for)
Unsorted:
Apps / report tools / app plugins
- BLT Toolkit (Tcl/Tk, free)
- HippoDraw (Python/Qt, free)
- Narrative (MacOSX, free)
- GraphX (MacOSX, free)
- GraphSketcher (MacOSX, free)
- Report Magic (Perl, free)
- DataViews (Java, free(verify))
- JasperReports (Java, free(verify))
- Agata
- Zest (Eclipse; Java)
- GraphFX (.NET/Java, paid-for)
- [3] (Java) analyses dependencies in java code
Unsorted (software)
- http://extra.amcharts.com/editor/
- http://www.highcharts.com/
- http://www.heavytrader.it/google-chart-generator.php
- http://www.icharts.net/portal/app?page=PublicPortal&service=external&sp=0
- http://www.richchartlive.com/RichChartLive/
- http://chartgen.blogspot.com/
- http://www.chartle.net/
- http://www.maptools.org/owtchart/chartgen.phtml
- http://code.google.com/apis/charttools/index.html
- http://www.chartgo.com/
- http://www.jscharts.com/
- http://www.artviper.net/css-chart-generator/create-css-chart.php
- http://nces.ed.gov/nceskids/createagraph/
- http://www.mathcracker.com/pie_chart.php
- http://piecolor.com/
- http://almaer.com/chartmaker/
Unsorted
- Map of Science
- Tree Radial Ballon Layout
- Typopath 1.0
- Radio Protector
- Research Chronology 2
- PhylloTrees: Phyllotactic Patterns for Tree Layout
http://exsitewebware.com/extrema/index.html
http://www.visualcomplexity.com/vc/project.cfm?id=482
http://www.visualcomplexity.com/vc/project.cfm?id=481
http://infosthetics.com/archives/2007/07/baby_stroller_day_trips.html
http://lifehacker.biz/articles/tools-for-creating-charts-and-diagrams/
SOM:
Amusing
Data visualization and/or lower level software
- https://visualization.hpc.mil/wiki/Application_List (a list)
- http://www.cis.jhu.edu/~mbowers/visualizationTools.html (a list)
- MayaVi [4] [5]
- VTK [6]
- Visualization Library [7]
- pizza.py [8]
3D oriented
http://code.google.com/p/birdeye/
See also
http://services.alphaworks.ibm.com/manyeyes/home
Collectors of ideas:
- http://www.visualcomplexity.com/vc/
- http://www.infovis-wiki.net/index.php/Main_Page
- http://services.alphaworks.ibm.com/manyeyes/home
- http://infosthetics.com/archives/2007/01/periodic_table_of_visualization_methods.html Periodic table of visualizations]