Mucking around with interdisciplinarity around MIT
@-moz-document url-prefix("https://mit.primo.exlibrisgroup.com/discovery/search?vid=01MIT_INST:MIT&lang=en") { | |
/* Insert code here... */ | |
body { | |
font-size: 16px; | |
} | |
div.header { | |
border-top: 2rem solid white; | |
} | |
.__xl div.header { | |
border-top-color: red; |
#!/usr/bin/env python | |
from __future__ import print_function | |
import json | |
import sys | |
from datetime import timedelta, datetime | |
from random import randint, choice | |
countries = ('004','008','010','012','016','020','024','028','031','032','036','040','044','048','050','051','052','056','060','064','068','070','072','074','076','084','086','090','092','096','100','104','108','112','116','120','124','132','136','140','144','148','152','156','158','162','166','170','174','175','178','180','184','188','191','192','196','203','204','208','212','214','218','222','226','231','232','233','234','238','239','242','246','248','250','254','258','260','262','266','268','270','275','276','288','292','296','300','304','308','312','316','320','324','328','332','334','336','340','344','348','352','356','360','364','368','372','376','380','384','388','392','398','400','404','408','410','414','417','418','422','426','428','430','434','438','440','442','446','450','454','458','462','466','470','474','478','480','484','492','496','498 |
This tweak to the standard Force Directed Graph from Mike Bostock implements sliding inputs to adjust the two primary factors to the visualization: linkDistance and charge. Compare to this, which changes the network itself
This simple force-directed graph shows character co-occurence in Les Misérables. A physical simulation of charged particles and springs places related characters in closer proximity, while unrelated characters are farther apart. Layout algorithm inspired by Tim Dwyer and Thomas Jakobsen. Data based on character coappearence in Victor Hugo's Les Misérables, compiled by Donald Knuth.
Compare this display to a force layout with curved links, a force layout with fisheye distortion and a matrix diagram.
This choropleth encodes employed populations from recent census data.
{ | |
"nodes":[ | |
{"name":"School of Architecture and Planning","group":1}, | |
{"name":"Architecture","group":1}, | |
{"name":"Media Arts and Sciences","group":1}, | |
{"name":"Urban Studies and Planning","group":1}, | |
{"name":"School of Engineering","group":2}, | |
{"name":"Aeronautics and Astronautics","group":2}, | |
{"name":"Biological Engineering","group":2}, |
A treemap recursively subdivides area into rectangles; the area of any node in the tree corresponds to its value. This example uses color to encode different packages of the Flare visualization toolkit. Treemap design invented by Ben Shneiderman. Squarified algorithm by Bruls, Huizing and van Wijk. Data courtesy Jeff Heer.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<title>Force based label placement</title> | |
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?2.6.0"></script> | |
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.layout.js?2.6.0"></script> | |
<script type="text/javascript" src="http://mbostock.github.com/d3/d3.geom.js?2.6.0"></script> | |
</head> | |
<body> |