Skip to content

Instantly share code, notes, and snippets.

@enjalot
Created October 23, 2013 05:29
Show Gist options
  • Save enjalot/7113017 to your computer and use it in GitHub Desktop.
Save enjalot/7113017 to your computer and use it in GitHub Desktop.
html5devconf color scale
{"description":"html5devconf color scale","endpoint":"","display":"div","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"survey.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}},"fullscreen":false,"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/EVlZF15.png"}
var results = tributary.survey;
results.forEach(function(d) {
d.evil = +d.evil;
d.passion = +d.passion;
d.age = +d.age || 0;
d.exp = +d.exp;
d.time = new Date(d.time);
})
var qmap = {
time: {q: "Timestamp"},
pb: {q: "What type of peanut butter do you prefer?", a: ["Crunchy", "Smooth"]},
toothpaste: {q:"Where do you squeeze the toothpaste from?", a: ["Top", "Bottom"]},
cv: {q:"Vanilla or Chocolate?", a: ["Chocolate", "Vanilla"]},
tp: {q:"What direction does toilet paper go on the holder thingy?", a: ["Over", "Under"]},
oj: {q:"Do you prefer pulp or no pulp in your orange juice?", a: ["Pulp", "No pulp"]},
evil: {q:"Where do you sit on the good vs. evil scale?"},
age: {q:"How old are you?"},
passion: {q:"How passionate of a person are you?"},
exp: {q:"How many years have you been building for the web?"}
}
var fields = Object.keys(qmap);
var questions = [
"pb", "toothpaste", "cv", "tp", "oj"
]
var field = questions[0];
results.sort(function(a,b) {return b[field] < a[field] ? -1: 1 })
var colorScale = d3.scale.ordinal()
.domain(qmap[field].a)
.range(["#fff", "#000"])
var display = d3.select("#display")
var ppl = display.selectAll("div.person")
.data(results)
ppl.enter()
.append("div").classed("person", true)
ppl.style({
width: "20px",
height: "20px",
float: "left",
margin: "2px",
"background-color": function(d) { return colorScale(d[field]) }
})
var legend = display.append("div")
.style({
float:"left",
clear:"left"
})
legend.append("span").text(field + ": " + qmap[field].q)
legend.append("br")
var one = legend.append("div")
one.append("div").style({
width: "20px",
height: "20px",
"background-color": colorScale(qmap[field].a[0])
})
one.append("span").text(qmap[field].a[0])
var two = legend.append("div")
two.append("div").style({
width: "20px",
height: "20px",
"background-color": colorScale(qmap[field].a[1])
})
two.append("span").text(qmap[field].a[1])
time pb toothpaste cv tp evil oj age passion exp
10/20/2013 15:16:09 Crunchy Top of the tube Chocolate Over 7 Pulp 35 2 12
10/20/2013 15:16:24 Smooth Bottom of the tube Chocolate Over 2 No pulp 30 8 1
10/20/2013 15:16:48 Smooth Top of the tube Chocolate Under 7 Pulp 29 6 10
10/20/2013 15:17:39 Crunchy Bottom of the tube Vanilla Over 3 No pulp 40 6 4
10/20/2013 15:22:30 Smooth Bottom of the tube Chocolate Over 3 Pulp 33 3 15
10/20/2013 15:28:16 Smooth Top of the tube Chocolate Over 4 Pulp 34 7 16
10/20/2013 15:32:51 Smooth Top of the tube Chocolate Over 4 Pulp 29 3 6
10/20/2013 15:34:49 Crunchy Top of the tube Vanilla Over 3 No pulp 29 7 3
10/20/2013 15:36:10 Smooth Bottom of the tube Vanilla Over 1 Pulp 32 6 16
10/20/2013 15:37:18 Crunchy Bottom of the tube Chocolate Over 2 Pulp 55 6 0
10/20/2013 15:39:38 Crunchy Bottom of the tube Chocolate Over 7 Pulp 30 7 3
10/20/2013 16:00:46 Smooth Bottom of the tube Vanilla Over 8 No pulp 27 7 7
10/20/2013 16:01:19 Crunchy Top of the tube Chocolate Over 2 No pulp 23 8 15
10/20/2013 16:06:25 Crunchy Top of the tube Vanilla Over 3 No pulp 26 7 7
10/20/2013 16:07:51 Crunchy Bottom of the tube Chocolate Over 3 Pulp 27 7 0
10/20/2013 16:12:50 Crunchy Bottom of the tube Chocolate Over 3 Pulp 7 7
10/20/2013 16:12:57 Crunchy Top of the tube Vanilla Under 3 Pulp 42 6 1
10/20/2013 16:18:00 Crunchy Bottom of the tube Chocolate Over 4 No pulp 27 3 1
10/20/2013 16:36:29 Crunchy Bottom of the tube Chocolate Under 9 Pulp 46 8 20
10/20/2013 16:38:44 Smooth Bottom of the tube Vanilla Over 4 Pulp 26 7 8
10/20/2013 16:43:12 Smooth Bottom of the tube Vanilla Over 8 No pulp 34 5 13
10/20/2013 16:52:04 Smooth Top of the tube Chocolate Over 7 Pulp 36 8 2
10/20/2013 16:56:41 Smooth Top of the tube Chocolate Over 3 Pulp 46 7 5
10/20/2013 17:03:52 Crunchy Bottom of the tube Chocolate Over 2 Pulp 35 3 18
10/20/2013 17:08:03 Crunchy Bottom of the tube Chocolate Over 5 Pulp 44 7 15
10/20/2013 17:08:07 Crunchy Top of the tube Chocolate Under 3 No pulp 34 8 10
10/20/2013 17:09:27 Crunchy Top of the tube Chocolate Over 3 Pulp 26 4 1
10/20/2013 17:14:13 Crunchy Bottom of the tube Chocolate Over 3 No pulp 38 6 14
10/20/2013 17:19:48 Crunchy Top of the tube Chocolate Over 2 Pulp 39 7 1.5
10/20/2013 17:23:47 Smooth Bottom of the tube Chocolate Over 3 Pulp 6 5
10/20/2013 17:34:03 Crunchy Bottom of the tube Vanilla Under 3 No pulp 41 5 2
10/20/2013 17:34:32 Crunchy Top of the tube Chocolate Over 3 Pulp 27 6 3
10/20/2013 17:40:23 Crunchy Top of the tube Chocolate Over 2 Pulp 28 6 12
10/20/2013 17:42:09 Smooth Bottom of the tube Chocolate Over 10 No pulp 37 7 12
10/20/2013 17:52:57 Crunchy Bottom of the tube Vanilla Over 5 No pulp 8 10
10/20/2013 17:59:52 Crunchy Bottom of the tube Vanilla Over 3 Pulp 30 3 4
10/20/2013 18:00:56 Crunchy Bottom of the tube Chocolate Under 4 No pulp 31 5 6
10/20/2013 18:04:30 Crunchy Bottom of the tube Chocolate Over 2 Pulp 28 3 8
10/20/2013 18:04:32 Smooth Bottom of the tube Vanilla Over 1 Pulp 33 8 8
10/20/2013 18:30:29 Crunchy Bottom of the tube Chocolate Over 4 Pulp 34 5 10
10/20/2013 18:42:40 Smooth Bottom of the tube Vanilla Over 6 No pulp 42 7 17
10/20/2013 18:44:26 Crunchy Top of the tube Chocolate Over 6 Pulp 24 7 4
10/20/2013 18:56:14 Smooth Bottom of the tube Vanilla Over 3 Pulp 26 8 4
10/20/2013 19:31:36 Crunchy Bottom of the tube Chocolate Over 3 Pulp 24 7 10
10/20/2013 19:44:35 Smooth Bottom of the tube Vanilla Over 8 Pulp 28 2 3
10/20/2013 20:15:55 Crunchy Bottom of the tube Chocolate Over 3 Pulp 24 6 1
10/20/2013 20:42:24 Crunchy Bottom of the tube Chocolate Under 9 Pulp 42 7 5
10/20/2013 21:03:37 Smooth Top of the tube Chocolate Over 6 Pulp 33 7 7
10/20/2013 21:36:36 Crunchy Bottom of the tube Chocolate Over 3 Pulp 31 7 10
10/20/2013 22:18:58 Crunchy Bottom of the tube Chocolate Under 2 No pulp 25 7 2
10/20/2013 22:26:43 Crunchy Top of the tube Chocolate Over 5 No pulp 25 6 4
10/20/2013 22:47:34 Smooth Bottom of the tube Vanilla Over 3 No pulp 45 3 14
10/20/2013 23:30:03 Crunchy Top of the tube Chocolate Over 4 Pulp 40 6 9
10/20/2013 23:31:38 Crunchy Top of the tube Vanilla Over 4 Pulp 26 6 1
10/21/2013 3:18:11 Smooth Top of the tube Vanilla Under 7 Pulp 42 8 15
10/21/2013 5:20:55 Smooth Bottom of the tube Vanilla Over 4 No pulp 60 7 20
10/21/2013 6:37:17 Crunchy Bottom of the tube Chocolate Over 2 Pulp 36 6 3
10/21/2013 7:47:32 Smooth Bottom of the tube Chocolate Over 4 No pulp 31 3 16
10/21/2013 8:33:04 Smooth Bottom of the tube Vanilla Over 5 Pulp 29 8 10
10/21/2013 9:18:56 Smooth Bottom of the tube Vanilla Under 4 Pulp 35 8 11
10/21/2013 10:39:05 Crunchy Bottom of the tube Vanilla Over 2 Pulp 37 4 12
10/21/2013 11:10:38 Smooth Bottom of the tube Vanilla Over 4 No pulp 28 6 2
10/21/2013 11:31:47 Crunchy Bottom of the tube Chocolate Over 5 Pulp 43 4 3
10/21/2013 13:24:26 Crunchy Top of the tube Chocolate Over 3 No pulp 30 5 4
10/21/2013 13:26:47 Smooth Top of the tube Vanilla Over 7 Pulp 29 6 6
10/21/2013 13:42:11 Smooth Bottom of the tube Chocolate Under 2 Pulp 40 2 10
10/21/2013 14:20:26 Smooth Bottom of the tube Vanilla Over 5 No pulp 31 4 2
10/22/2013 2:27:42 Smooth Bottom of the tube Chocolate Over 3 Pulp 31 5 14
10/22/2013 3:43:32 Crunchy Top of the tube Chocolate Over 1 Pulp 25 8 1
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment