|
1 var w = 120, |
|
2 h = 500, |
|
3 m = [10, 50, 20, 50], // top right bottom left |
|
4 min = Infinity, |
|
5 max = -Infinity; |
|
6 |
|
7 var chart = d3.chart.box() |
|
8 .whiskers(iqr(1.5)) |
|
9 .width(w - m[1] - m[3]) |
|
10 .height(h - m[0] - m[2]); |
|
11 |
|
12 d3.csv("../data/morley.csv", function(csv) { |
|
13 var data = []; |
|
14 |
|
15 csv.forEach(function(x) { |
|
16 var e = ~~x.Expt - 1, |
|
17 r = ~~x.Run - 1, |
|
18 s = ~~x.Speed, |
|
19 d = data[e]; |
|
20 if (!d) d = data[e] = [s]; |
|
21 else d.push(s); |
|
22 if (s > max) max = s; |
|
23 if (s < min) min = s; |
|
24 }); |
|
25 |
|
26 chart.domain([min, max]); |
|
27 |
|
28 var vis = d3.select("#chart").selectAll("svg") |
|
29 .data(data) |
|
30 .enter().append("svg:svg") |
|
31 .attr("class", "box") |
|
32 .attr("width", w) |
|
33 .attr("height", h) |
|
34 .append("svg:g") |
|
35 .attr("transform", "translate(" + m[3] + "," + m[0] + ")") |
|
36 .call(chart); |
|
37 |
|
38 chart.duration(1000); |
|
39 window.transition = function() { |
|
40 vis.map(randomize).call(chart); |
|
41 }; |
|
42 }); |
|
43 |
|
44 function randomize(d) { |
|
45 if (!d.randomizer) d.randomizer = randomizer(d); |
|
46 return d.map(d.randomizer); |
|
47 } |
|
48 |
|
49 function randomizer(d) { |
|
50 var k = d3.max(d) * .02; |
|
51 return function(d) { |
|
52 return Math.max(min, Math.min(max, d + k * (Math.random() - .5))); |
|
53 }; |
|
54 } |
|
55 |
|
56 // Returns a function to compute the interquartile range. |
|
57 function iqr(k) { |
|
58 return function(d, i) { |
|
59 var q1 = d.quartiles[0], |
|
60 q3 = d.quartiles[2], |
|
61 iqr = (q3 - q1) * k, |
|
62 i = -1, |
|
63 j = d.length; |
|
64 while (d[++i] < q1 - iqr); |
|
65 while (d[--j] > q3 + iqr); |
|
66 return [i, j]; |
|
67 }; |
|
68 } |