Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@vlandham
vlandham / README.md
Created December 5, 2012 14:37 — forked from mbostock/.block
Focus+Context via Brushing

This examples demonstrates how to use D3's brush component to implement focus + context zooming. Click and drag in the small chart below to pan or zoom.

@vlandham
vlandham / citysearch.py
Created December 6, 2012 15:02 — forked from MoritzStefaner/citysearch.py
Search where people are moving in Germany
# coding: utf-8
# requires: pattern http://www.clips.ua.ac.be/pages/pattern
from pattern.web import *
import csv
import sys
# yeah I know
reload(sys)
sys.setdefaultencoding("utf-8")
@vlandham
vlandham / README.md
Created January 11, 2013 21:11 — forked from mbostock/.block

Brushing makes more sense for quantitative dimensions. It’s possible to use a brush to select categorical values, as shown here, though I’d recommend using per-value toggles instead. This way, users can pick arbitrary sets of values, rather than being forced to pick contiguous ranges.

@vlandham
vlandham / index.html
Last active December 14, 2015 07:29 — forked from ZJONSSON/index.html
<!DOCTYPE html>
<html>
<head>
<title>Testing d3.js in Leaflet.js</title>
<link rel="stylesheet" href="leaflet.css"></link>
<script src="http://mbostock.github.com/d3/d3.v2.js?2.8.1"></script>
<script src="http://cdn.leafletjs.com/leaflet-0.5/leaflet.js"></script>
<style type="text/css">
svg , g
@vlandham
vlandham / math_demo.js
Created February 28, 2013 21:02 — forked from tmcw/README.md
// Turning an angle into a point on a unit
// circle and then back again
// convert from degrees to radians
D2R = Math.PI / 180;
// convert from radians to degrees
R2D = 180 / Math.PI;
// our angle
angle = 30;

Using d3.geo.tile to display raster image tiles underneath some TopoJSON vectors, and d3.behavior.zoom for pan & zoom.

@vlandham
vlandham / Makefile
Created December 21, 2013 21:57 — forked from mjhoy/Makefile
all: hill-relief.jpg costarica_min_topo.json
# -------------
# Relief raster
# -------------
#
# Notice the `zip` file requirements here have no download.
# You will need to search for them online. They are from the
# SRTM project: http://www2.jpl.nasa.gov/srtm/
# (which appears to have multiple versions of files).

A short code excerpt from this visualization I created for the longform article “Iouri Podladtchikov – You only fly once” by the Neue Zürcher Zeitung.

It's a very simple way to create an interactive animation based on video material. Hover over the image to go through the animation.

I used Final Cut Pro to export the frames of a short video sequence, which I then stitched together into a single film strip using ImageMagick: convert folder-of-stills/* +append filmstrip.jpg

@vlandham
vlandham / README.md
Last active September 30, 2019 22:59 — forked from awoodruff/README.md
Head Projections Remix

A quick hack on the beautifully executed projection example from Andy Woodruff. I just wanted to see them all on one screen.

Click the Open in new window button to see them all.

Novel code Inspired once again by Jason Davies.

Andy's original text:

We've all seen the projected head from Elements of map projection with applications to map and chart construction, but the authors in 1921 did not have D3 to help them show a full range of weird distorted faces. This is based on the Map Projection Transitions example by Jason Davies.

# Requires ImageMagick
# Converting the source from JPEG to PNG - if necessary
convert my_src_image.jpg my_src_image.png
# Option A
# - Requires a temporary intermediate file
# - Drill more than 10 might result in poor results