scale

_.md

[ Launch Inlet ]
Gist #4113154
Gist #4112796 [ Launch Inlet ]
Gist #4109085 [ Launch Inlet ]
Gist #4108650 [ Launch Inlet ]
Gist #3200444

build_times.json

{
  "build_times":
  [
    140.894, 59.999, 60.000, 59.0, 58, 50, 131.685, 82.825, 67.13, 64.794, 58.199, 52.644, 44.784, 43.634, 43.536, 43.245, 41.782, 40.516, 40.152, 36.701, 33.629, 33.039, 22.708, 22.416, 22.068, 19.25, 15.468, 12.918, 12.507, 11.508, 11.018, 10.288, 9.623, 8.348, 7.071, 6.628, 6.433, 5.699, 5.69, 4.736, 4.664, 3.936, 3.781, 2.889, 2.835, 2.144, 2.005, 1.892, 1.869, 1.809, 1.093, 0.957, 0.929, 0.725, 0.602, 0.565, 0.542, 0.463, 0.434, 0.245, 0.239, 0.238, 0.216, 0.207, 0.191, 0.187, 0.172, 0.157, 0.153, 0.153, 0.147, 0.127, 0.113, 0.111, 0.096, 0.096, 0.092, 0.083, 0.08, 0.075, 0.066, 0.059, 0.057, 0.055, 0.045, 0.037, 0.02, 0.018, 0.014, 0.011, 0.01, 0.007, 0.004, 0.004, 0.002, 0.002
  ]
}

config.json

{"description":"scale","endpoint":"","display":"svg","public":true,"require":[],"tab":"edit","display_percent":0.750694444444445,"play":false,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01}

helpers.js

tributary.minutes = function(d) {
  var minutes = [];
  for(var i = 0; i < d.length; i++)
    if(d[i] >= 60 && d[i] < 3600)
      minutes.push(d[i])
  return minutes
};
  
tributary.seconds = function(d) {
  var seconds = [];
  for(var i = 0; i < d.length; i++)
    if(d[i] >= 1 && d[i] < 60)
      seconds.push(d[i])
  return seconds
};

tributary.milli = function(d) {
  var milli = [];
  for(var i = 0; i < d.length; i++)
    if(d[i] < 1)
      milli.push(d[i])
  return milli
}

inlet.js

var range = [5, 979];

var svg = d3.select("svg");
var times = tributary.build_times.build_times;
var minute_scale = d3.scale.linear()
    .domain([60, 150])
    .range(range);
var second_scale = d3.scale.linear()
    .domain([1, 60])
    .range(range);
var milli_scale = d3.scale.linear()
    .domain([0, 1])
    .range(range);
var trig = d3.scale.linear()
    .domain([1, 10])
    .range([0, 2*Math.PI])
    
var minutes = tributary.minutes;
var seconds = tributary.seconds;
var milli   = tributary.milli;

var minute_times = minutes(times);
var second_times = seconds(times);
var milli_times = milli(times);

var minute_text = svg.selectAll('minute_group')
  .data(minute_times)
  .enter()
  .append('text');

var height_scale = 130;
var y_shift = 180;
minute_text
  .text(function(d){
    return d
  })
  .attr('x', function(d){
    return minute_scale(d)
  })
  .attr('y', function(d,i) {
    return height_scale*Math.cos(trig(i)) + 1*y_shift
  })
  .attr('fill', '#CE1515');

var second_text = svg.selectAll('second_group')
  .data(second_times)
  .enter()
  .append('text');

second_text
  .text(function(d){
    return d
  })
  .attr('x', function(d){
    return second_scale(d)
  })
  .attr('y', function(d,i) {
    return height_scale*Math.cos(trig(i)) + 2*y_shift
  })
  .attr('fill', '#B8CE15');

var milli_text = svg.selectAll('milli_group')
  .data(milli_times)
  .enter()
  .append('text');

milli_text
  .text(function(d){
    return d
  })
  .attr('x', function(d){
    return milli_scale(d)
  })
  .attr('y', function(d,i) {
    return height_scale*Math.cos(trig(i)) + 3*y_shift 
  })
  .attr('fill', '#1593CE');

var one_to_twenty = [1,2,3,4,5,5.5,6,7,8,9,10]
var trig_text = svg.selectAll('trig_group')
    .data(one_to_twenty)
    .enter()
    .append('text');
trig_text
  .text(function(d) {
    return (10*Math.cos(d)).toFixed(2) + 400
  })
  .attr('x', function(d,i){
    return i*100
  })
  .attr('y', function(d){
    return 700
  })