Skip to content

Instantly share code, notes, and snippets.

@tophtucker
tophtucker / Makefile
Created Aug 3, 2015
Multiline indexing
View Makefile
GENERATED_FILES = \
unemployment.tsv
.PHONY: all clean
all: $(GENERATED_FILES)
clean:
rm -rf -- $(GENERATED_FILES)
@tophtucker
tophtucker / README.md
Last active Sep 13, 2019
Mock polygraph illustration
View README.md
@tophtucker
tophtucker / README.md
Last active Apr 10, 2017
Fluid/responsive Bloomberg video player
View README.md

Wraps the Bloomberg video player in a fluid container that maintains aspect ratio.

  1. Click the 'Share' button and copy the embed code from a Bloomberg video
  2. Paste where it says <!-- PASTE STANDARD EMBED CODE HERE -->
  3. In the embed code, change "offsite_embed":true to "offsite_embed":false

N.B.: The video-wrapper should not contain anything else! If you want to add a caption or something, do it outside.

@tophtucker
tophtucker / index.html
Last active Aug 29, 2015
Nested list columns
View index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
ul {
list-style-type: none; /* no bullets */
padding-left: 0; /* no spacing on left */
}
li {
clear: both; /* start a new line, kinda */
View README.md

Factoring out the geometric background part of the opener for this Bloomberg Businessweek story on ketamine. Move your mouse left and right to change the speed. Move your mouse up and down to change the amplitude.

Text can be overlaid with the query string variable text, e.g. http://bl.ocks.org/tophtucker/raw/500d2a010105cfcc87db/?text=KETAMINE.

It's a bunch of concentric circles with exclusion compositing. The radius of the ith circle oscillates with amplitude * Math.sin(t/speed + (t/10000)*i), where t is the number of milliseconds since you loaded the page.

E.g., for amplitude = 5 and speed = 500 (which is the default if you position your mouse in the middle of the page), the radius of circle i at time t oscillates with period (20000π)/(20+i) in t ([WolframAlpha](http://www.wolframalpha.com/input/?i=5*sin%28t%2F500+%2B+%28t%2F10000%29*i%

@tophtucker
tophtucker / README.md
Last active Oct 9, 2015
How LIBOR works
View README.md

Every day, 16 banks say how much it might cost them to borrow in various currencies, for various lengths of time. The four highest and four lowest figures are discarded, and the average of the remaining eight become that day’s Libor. In this toy model of how Libor works, you have total control over how one bank sets its rates, and some random partial influence on other banks, who will tend to follow you. Move your mouse along the axis to set your rate. Read the full story

View index.html
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<link rel="stylesheet" type="text/css" href="main.css"/>
<body>
@tophtucker
tophtucker / index.html
Last active Sep 13, 2019
Lenticular II
View index.html
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<link rel="stylesheet" type="text/css" href="main.css"/>
<body>
@tophtucker
tophtucker / index.html
Last active Sep 13, 2019
Lenticular III
View index.html
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<link rel="stylesheet" type="text/css" href="main.css"/>
<body>
View index.html
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<link rel="stylesheet" type="text/css" href="main.css"/>
<body>