Choropleth Test State

_.md

[ Launch: Choropleth Test County ] 7506835 by poezn
[ Launch: Choropleth Test ] 7494487 by poezn

config.json

{"description":"Choropleth Test State","endpoint":"","display":"svg","public":true,"require":[{"name":"TopoJSON","url":"http://d3js.org/topojson.v1.min.js"}],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"data.csv":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"us.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"styles.css":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":true,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"pingpong","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"thumbnail":"http://i.imgur.com/PXSQbbH.png"}

data.csv

inlet.js

var haById = d3.map();
var hbById = d3.map();

var data = tb.data;
_.each(data, function(d) {
  haById.set(d.county, +d.ha100mile);
  hbById.set(d.county, +d.hb100mile);
});

var max = d3.max(_.pluck(data, "ha100mile"));
max = 15;
console.log(haById)

var us = tb.us;

var width = 960,
    height = 500;

var quantize = d3.scale.quantize()
    .domain([0, max])
    .range(d3.range(9).map(function(i) { return "q" + i + "-9"; }));

var path = d3.geo.path();

var svg = g; 


function ready(us) {
  svg.append("g")
      .attr("class", "counties")
    .selectAll("path")
      .data(topojson.feature(us, us.objects.counties).features)
    .enter().append("path")
      .attr("class", function(d) { return quantize(hbById.get(+d.id)); })
      .attr("d", path);

  svg.append("path")
      .datum(topojson.mesh(us, us.objects.states, function(a, b) { return a !== b; }))
      .attr("class", "states")
      .attr("d", path);
}

ready(us);

styles.css

.counties {
  fill: none;
}

.states {
  fill: none;
  stroke: #fff;
  stroke-linejoin: round;
}

.q0-9 { fill:rgb(247,251,255); }
.q1-9 { fill:rgb(222,235,247); }
.q2-9 { fill:rgb(198,219,239); }
.q3-9 { fill:rgb(158,202,225); }
.q4-9 { fill:rgb(107,174,214); }
.q5-9 { fill:rgb(66,146,198); }
.q6-9 { fill:rgb(33,113,181); }
.q7-9 { fill:rgb(8,81,156); }
.q8-9 { fill:rgb(8,48,107); }

us.json