words

_.md

[ Launch: words ] 13fc5a9b7fb218bfffec by Y4suyuki

config.json

{"description":"words","endpoint":"","display":"svg","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"words.json":{"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},"style.css":{"default":true,"vim":false,"emacs":false,"fontSize":12},"test.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,"ajax-caching":true,"thumbnail":"http://i.imgur.com/wG7KAYq.png"}

inlet.js

var words = tributary.words;

var height = 542;
var y_margin = 30;
var x_margin = 74;


function sort(x, f) {
    y = x;
    y.sort(f);
    return y;
}

var format = d3.time.format("%a %b %e %H:%M:%S %Y");
var svg = d3.select('svg');
var ind_format = d3.time.format("%Y-%j");

console.log(words.map(function(x) { 
  var d = format.parse(x.date);
  return d.getDate(); 
}));

function head(x){
  return x[0];
}
function tail(x) {
  return x.slice(1, x.length);
}
function update(o,k,v) {
  var no = o;
  no[k] = v;
  return no;
}

function words_proc(w, nw, o) {
  var wh, nnw, whd, no;
  if (w.length==0) {
    return nw;
  } else {
    wh = head(w);
    nnw = nw.concat([wh]);
    whd = format.parse(wh.date);
    if (ind_format(whd) in o) {
      nnw[nnw.length-1].ind = o[ind_format(whd)];
      no = update(o, ind_format(whd), o[ind_format(whd)] + wh.word.length);
    } else {
      nnw[nnw.length-1].ind = 0;
      no = update(o, ind_format(whd), wh.word.length);
    }

    return words_proc(tail(w), nnw, no);
  }
}



var new_words = words_proc(words, [], {});

console.log(new_words.map(function(e) { return e.ind }))
console.log(new_words)

var y = d3.time.scale()
.range([height, y_margin]);


var yAxis = d3.svg.axis()
.scale(y)
.orient('left');


// set domain of y scale
y.domain([d3.max(new_words, function(x) {
            return format.parse(x.date)
          }),
          d3.min(new_words, function(x) {
            return format.parse(x.date);
          })]);


// bind data to g elements            
svg.selectAll('g')
.data(new_words)
.enter()
.append('g')
.attr('transform', function(d,i) {
  return 'translate(' + (x_margin + d.ind * 14) + ',' + (y(format.parse(d.date)) - 15) + ')';
})
.attr('class', 'word')
.on('mouseover', function(d) {
  d3.select(this).select('rect').attr('fill', '#cbcf52');
  d3.select(this).append('text')
  .text(d.date)
  .attr('fill', '#000')
  .attr('class', 'date')
  .attr('transform', 'translate(' + 20 + ',' + -5 + ')');
})
.on('mouseout', function() {
  d3.select(this).select('rect').attr('fill', '#51acd0');
  d3.select(this).select('text.date').remove();
});


// bind rectangle background for each g elements
d3.selectAll('g.word')
.append('rect')
.attr('height', 28)
.attr('transform', 'translate(' + 2 + ',' + -1.24 + ')')
.attr('width', function(d) {
  return d.word.length * 9 + 40;
})
.attr('fill', '#51acd0')
.attr('rx', 5)
.attr('ry', 7);


// bind text for each g elements
svg.selectAll('g')
.append('text')
.text( function(d) {
  return d.word;
})
.attr('transform', 'translate(' + 8 + ',' + 18 + ')')
.attr('fill', '#e8f0bb')
.style('font-family', 'Verdana')
.style('font-size', 22);

svg.append('g')
.attr('class', 'y axis')
.attr('transform', 'translate(' + x_margin + ',' + 0 + ')')
.call(yAxis);

style.css

.axis path, .axis line {
  fill:none;
  stroke: #000;
  shape-rendering: crispEdges;
}

test.json

[{"date":"Thu Oct 16 17:37:06 2014","word":"fire"},{"date":"Thu Oct 16 17:02:42 2014","word":"get"}]

words.json

[{"date":"Thu Oct 16 17:37:06 2014","word":"fire"},{"date":"Thu Oct 16 17:02:42 2014","word":"get"},{"date":"Sat Nov 22 01:55:23 2014","word":"sacrosanct"},{"date":"Sun Oct 12 15:12:04 2014","word":"animosity"},{"date":"Wed Oct 15 11:03:29 2014","word":"shola"},{"date":"Sat Nov  1 17:09:54 2014","word":"litigation"},{"date":"Sun Oct 12 15:14:01 2014","word":"holler"},{"date":"Sun Oct 12 15:12:58 2014","word":"resentful"},{"date":"Fri Nov 21 01:02:15 2014","word":"elusive"},{"date":"Mon Oct 13 05:57:04 2014","word":"fraction"},{"date":"Sun Oct 12 15:12:36 2014","word":"cater"},{"date":"Mon Oct 13 05:13:27 2014","word":"elaborate"},{"date":"Sun Oct 12 15:13:15 2014","word":"resent"},{"date":"Tue Nov 18 08:59:28 2014","word":"cramp"},{"date":"Tue Oct 21 09:39:03 2014","word":"drag"},{"date":"Sat Nov 22 01:58:28 2014","word":"serene"},{"date":"Fri Nov 21 14:25:03 2014","word":"incumbent"},{"date":"Tue Oct 21 17:16:37 2014","word":"tome"},{"date":"Mon Oct 13 08:31:42 2014","word":"op"},{"date":"Fri Nov 21 14:25:05 2014","word":"incumbent"},{"date":"Sat Oct 25 02:38:58 2014","word":"hymnal"},{"date":"Sat Nov 22 01:57:04 2014","word":"sideswipe"},{"date":"Fri Oct 17 12:50:45 2014","word":"coasting"},{"date":"Sat Nov 22 01:55:20 2014","word":"sacrosan"},{"date":"Fri Nov 21 14:30:50 2014","word":"ecclesiastical"},{"date":"Wed Oct 15 11:03:38 2014","word":"shill"},{"date":"Sun Oct 12 15:13:38 2014","word":"streak"},{"date":"Fri Nov 21 01:01:49 2014","word":"adage"},{"date":"Tue Oct 21 16:15:11 2014","word":"signify"},{"date":"Mon Nov 17 13:02:47 2014","word":"levy"},{"date":"Sat Oct 25 02:38:24 2014","word":"crosshair"},{"date":"Sun Nov  9 06:21:20 2014","word":"asthma"},{"date":"Sat Nov  1 16:57:46 2014","word":"pickup"},{"date":"Fri Nov 21 14:30:49 2014","word":"ecclesiastical"},{"date":"Tue Oct 21 09:34:15 2014","word":"facet"}]