Infographics are rapidly changing the way we consume information by creating graphical representations that aggregate data or show flows, and are able to display a great quantity of knowledge in a very intuitive and easy-to-use way. A great source of information about this topic is the blog, FlowingData (http://flowingdata.com/).
For this project, we will use the following stunning infographic created by Oxigenio, an Italian-based company (http://www.officinastrategia.it):
We want to reserve most of the browser's viewport area for this amazing infographic, except for a sidebar, 200 px wide, which contains some commands we'll see in a moment. First let's define some basic HTML in an index.html
file:
<!doctype html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <title> A ZUI for an infographic</title> <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3...