Skip to content

Instantly share code, notes, and snippets.

@ganeshv

ganeshv/README.md

Last active October 31, 2015 15:00
Show Gist options
  • Save ganeshv/c946fd2004d13e7b3304 to your computer and use it in GitHub Desktop.
Save ganeshv/c946fd2004d13e7b3304 to your computer and use it in GitHub Desktop.
Download ZIP
Life Expectancy - Orthographic Projection
Raw
README.md

Life expectancy data for countries, obtained from Wikipedia and plotted with pigshell on an orthographic projection. The template is based on Rotate the world by Jason Davies. Colors by Cynthia Brewer

ycat http://en.wikipedia.org/wiki/List_of_countries_by_life_expectancy | hgrep -r 0 table.wikitable | table2js foo country data | iframe -o proj=orthographic -g /usr/template/d3-worldmap1

Running through the pipeline step by step:

  • ycat uses YQL to retrieve the contents of the Wikipedia page. We use ycat to jump the same-origin barrier.
  • hgrep selects HTML elements using a jQuery/CSS-like expression.
  • table2js converts the table contents into plain Javascript objects, the contents of the first three ""s of a row corresponding to the foo, country and data properties of the object.
  • iframe supplies the objects to an HTML template rendered in a sandboxed iframe.

You can rotate and zoom the globe using mouse or touch.

Raw
index.html
<!DOCTYPE HTML>
<html lang="en">
<head>
<link href="http://pigshell.com/v/0.6.4/pigshell.css" rel="stylesheet"/>
</head>
<body>
<div class="pigshell">
<div class="pmain2" id="pmain2">
<!--[if lte IE 11]>
<p class="warning">Pigshell is known to work on recent (~2013-14) versions of Firefox and Chrome. It is unlikely to work on other browsers like IE and platforms like the iPad.</p>
</p>
<![endif]-->
<p id="loading" class="info">Loading kernel...</p>
</div>
</div>
<![if gte IE 11]>
<script src="http://pigshell.com/v/0.6.4/libs.js"></script>
<script src="http://pigshell.com/v/0.6.4/pigshell.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var ps = pigshell,
sorry = "Pigshell is known to work on recent (~2013-14) versions of Firefox and Chrome. It is unlikely to work on other browsers like IE and platforms like the iPad.";
if (!ps.compatible()) {
$("#pmain1").prepend("<p class='warning'>" + sorry + "</p>");
}
ps.HttpFS.defaults.tx = 'direct';
var script = ps.multiline(function() {/*
markdown $(jf 'window.location' 1)/README.md
mount http://pigshell.com/v/$(uname -r)/usr/ /usr
sh -s /etc/profile
ycat http://en.wikipedia.org/wiki/List_of_countries_by_life_expectancy | hgrep -r 0 table.wikitable | table2js foo country data | iframe -o proj=orthographic,title="Life Expectancy at Birth (years)" -g /usr/template/d3-worldmap1
*/});
ps.init({rooturi: 'http://pigshell.com/v/0.6.4/root.tar',
embedded: true}, ps.hef('#pmain2', function() {
var p2 = ps.popen("ish -N ish1", {stdout: "#pmain2"});
p2.read({}, ps.hef('#pmain2', function(){}));
ps.publish('ish1', script);
}));
});
</script>
<![endif]>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment