Skip to content

Instantly share code, notes, and snippets.

View milroc's full-sized avatar

Miles McCrocklin milroc

142 followers · 62 following
View GitHub Profile
@milroc
milroc / FontAwesome.otf
Last active August 29, 2015 13:56
@milroc
milroc / charts.js
Last active August 29, 2015 13:56
urban data hacking
d3.custom = {};
d3.custom.utils = {};
d3.custom.utils.windowResize = function() {};
d3.custom.heatmap = function() {
// basic data
var margin = {top: 0, bottom: 0, left: 0, right: 0},
@milroc
milroc / index.html
Last active August 29, 2015 13:57
Contextually aware axis ticks
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
<style>
.axis text {
font: 14px 'Inconsolata';
}
@milroc
milroc / _.md
Created March 27, 2014 22:20
bars
@milroc
milroc / flare.json
Created March 28, 2014 20:23
Data for bl.ocks
{
"name": "flare",
"children": [
{
"name": "analytics",
"children": [
{
"name": "cluster",
"children": [
{"name": "AgglomerativeCluster", "size": 3938},
@milroc
milroc / index.html
Last active August 29, 2015 13:57
Fitts's Bar, II
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<!-- CDN IMPORTS -->
<link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
<!-- LOCAL IMPORTS -->
<!-- IN GIST -->
<link rel="stylesheet/less" type="text/css" href="style.less">
@milroc
milroc / README.md
Created April 9, 2014 21:12 — forked from ZJONSSON/README.md

d3.legend

d3.legend is a quick hack to add a legend to a d3 chart. Simply add a g and .call(d3.legend). Any elements that have a title set in the "data-legend" attribute will be included when d3.legend is called. Each title will appear only once (even when multiple items define the same data-legend) as the process uses a set based on a existing names, not an array of all items.

Color

By default the color in the legend will try to match the fill attribute or the stroke attribute of the relevant items. Color can be explicitly defined by attribute "data-legend-color"

Order

The order of items in the legend will be sorted using the top of the bounding box for each included item. The order can be explicitly defined by attribute "data-legend-pos"

@milroc
milroc / README.md
Last active August 29, 2015 13:59 — forked from mbostock/.block
d3.dispatch + reusable components
@milroc
milroc / README.md
Created June 12, 2014 17:41 — forked from mbostock/.block
@milroc
milroc / README.md
Last active August 29, 2015 14:08 — forked from mbostock/.block

Source: American Community Survey, 2011 5-Year Estimate

This map was inspired by a similar map found on Wikipedia. I wasn’t wild about the diverging color scale, so I thought it would be a fun challenge to recreate.

Finding the shapefiles was easy; I used the U.S. National Atlas 1:1,000,000 scale dataset, conveniently packaged in my U.S. Atlas repository. I reprojected the shapefiles to the California Albers projection using ogr2ogr:

ogr2ogr \
	-f 'ESRI Shapefile' \
	-t_srs 'EPSG:3310' \