This is the chord diagram dex.js coordinates visualization of US Presidents and their Home State and Party affiliations.
- dex.js The main site
license: mit |
<!DOCTYPE html> | |
<html> | |
<head> | |
<style> | |
html, body, #Chart { | |
height: 100%; | |
min-height: 100%; | |
width: 100%; | |
min-width: 100%; | |
} | |
#Chart { | |
display: inline-block; | |
} | |
</style> | |
<title>Chord Diagram</title> | |
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.css"> | |
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.theme.min.css"> | |
<link rel="stylesheet" href="https://dexjs.net/js/dex-jquery.css"> | |
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css"/> | |
<link rel="stylesheet" href="https://dexjs.net/js/dex-bootstrap.css"> | |
<link rel="stylesheet" href="https://dexjs.net/js/dex.css"> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> | |
<script src="https://dexjs.net/js/dex-jquery.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script> | |
<script src="https://dexjs.net/js/dex-bootstrap.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> | |
<script src="https://dexjs.net/js/dex-libs.js"></script> | |
<script src="https://dexjs.net/js/dex.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/Faker/3.1.0/faker.min.js"></script> | |
</head> | |
<body> | |
<div class="ui-layout-center"> | |
<div id="Chart"></div> | |
</div> | |
<div class="ui-layout-west"> | |
<div id="ConfigurationPane"></div> | |
</div> | |
<script> | |
d3.csv("presidents.csv", function (error, data) { | |
var presidents = new dex.csv(data).include([1, 2, 3]); | |
$(document).ready(function () { | |
$('body').layout({ | |
applyDemoStyles: false, | |
west: { | |
size: 335 | |
}, | |
onresize: function () { | |
chart.resize(); | |
} | |
}); | |
var chart = dex.charts.d3.Chord({ | |
'parent': '#Chart', | |
'csv': presidents | |
} | |
); | |
chart.render(); | |
var configPane = dex.ui.ConfigurationPane({ | |
"parent": "#ConfigurationPane", | |
"csv": presidents, | |
"components": [chart] | |
}).render(); | |
}); | |
}); | |
</script> | |
</body> | |
</html> |
Presidency | President | Party | Home State | |
---|---|---|---|---|
1 | George Washington | Independent | Virginia | |
2 | John Adams | Federalist | Massachusetts | |
3 | Thomas Jefferson | Dem/Rep | Virginia | |
4 | James Madison | Dem/Rep | Virginia | |
5 | James Monroe | Dem/Rep | Virginia | |
6 | John Quincy Adams | Dem-Rep/Nat-Rep | Massachusetts | |
7 | Andrew Jackson | Democratic | Tennessee | |
8 | Martin Van Buren | Democratic | New York | |
9 | William Henry Harrison | Whig | Ohio | |
10 | John Tyler | Whig | Virginia | |
11 | James K. Polk | Democratic | Tennessee | |
12 | Zachary Taylor | Whig | Louisiana | |
13 | Millard Fillmore | Whig | New York | |
14 | Franklin Pierce | Democratic | New Hampshire | |
15 | James Buchanan | Democratic | Pennsylvania | |
16 | Abraham Lincoln | Rep/Nat Union | Illinois | |
17 | Andrew Johnson | Dem/Nat Union | Tennessee | |
18 | Ulysses S. Grant | Republican | Ohio | |
19 | Rutherford B. Hayes | Republican | Ohio | |
20 | James A. Garfield | Republican | Ohio | |
21 | Chester A. Arthur | Republican | New York | |
22 | Grover Cleveland | Democratic | New York | |
23 | Benjamin Harrison | Republican | Indiana | |
24 | Grover Cleveland (2nd term) | Democratic | New York | |
25 | William McKinley | Republican | Ohio | |
26 | Theodore Roosevelt | Republican | New York | |
27 | William Howard Taft | Republican | Ohio | |
28 | Woodrow Wilson | Democratic | New Jersey | |
29 | Warren G. Harding | Republican | Ohio | |
30 | Calvin Coolidge | Republican | Massachusetts | |
31 | Herbert Hoover | Republican | Iowa | |
32 | Franklin D. Roosevelt | Democratic | New York | |
33 | Harry S. Truman | Democratic | Missouri | |
34 | Dwight D. Eisenhower | Republican | Texas | |
35 | John F. Kennedy | Democratic | Massachusetts | |
36 | Lyndon B. Johnson | Democratic | Texas | |
37 | Richard Nixon | Republican | California | |
38 | Gerald Ford | Republican | Michigan | |
39 | Jimmy Carter | Democratic | Georgia | |
40 | Ronald Reagan | Republican | California | |
41 | George H. W. Bush | Republican | Texas | |
42 | Bill Clinton | Democratic | Arkansas | |
43 | George W. Bush | Republican | Texas | |
44 | Barack Obama | Democratic | Illinois |