An interactive version of a Reingold–Tilford tree. Click on the nodes to expand or collapse.
{ | |
"name": "flare", | |
"children": [ | |
{ | |
"name": "analytics", | |
"children": [ | |
{ | |
"name": "cluster", | |
"children": [ | |
{"name": "AgglomerativeCluster", "size": 3938}, |
I would like to ink on some d3-created visualizations. I really like d3, so I thought I'd create the inking with it too, instead of introducing another library into my project.
However, I could only find one demo of d3-based inking: a block on bl.ocks.org by 'cloudshape'.
It was almost exactly what I wanted, except there was this strange offset between where I placed my mouse, and where the line was drawn. So... I copied the code into Brackets and modified it until this offset was gone. I think it's a small but significant improvement. Now I'm sharing it as a 'block' of my own!
Cloudshapes, thank you so much for creating the original drawing app. You did all this work, and I am grateful. I just changed one line of code!
<html> | |
<head> | |
<style> | |
body {padding:50px} | |
</style> | |
<!-- Latest compiled and minified CSS --> | |
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> | |
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> |
#adapted from minus_context | |
import nltk | |
import feedparser | |
import random | |
import twitter | |
import yaml | |
import string | |
import re | |
from urlparse import urlparse |
import matplotlib.pyplot as plt | |
from matplotlib.collections import PatchCollection | |
from descartes import PolygonPatch | |
import fiona | |
from shapely.geometry import Polygon, MultiPolygon, shape | |
# We can extract the London Borough boundaries by filtering on the AREA_CODE key | |
mp = MultiPolygon( | |
[shape(pol['geometry']) for pol in fiona.open('data/boroughs/boroughs.shp') | |
if pol['properties']['AREA_CODE'] == 'LBO']) |
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 scatterplot is constructed from a TSV file storing the dimensions of sepals and petals of various iris flowers. The chart employs conventional margins and a number of D3 features:
- d3.tsv - load and parse data
- d3.scale.linear - x- and y-position encoding
- d3.scale.ordinal - color encoding
- d3.extent - compute domains
- d3.svg.axis - display axes
Well, I wanted to
- make and share an IPython notebook as a gist.
- make a joke in a graph formatted like an XKCD comic.
- express my own relationship with the New England winter.
I hope I've managed all three in one fell swoop!
-elg