README.md

## README.md

      
        

          Raw
        
        
          
            
          
          
            
              README.md
            
          
        
      
    
  
    Built with blockbuilder.org

  

  

## index.html
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
  <style>
    table {
      border-collapse: collapse;
    }
    th:first-child, td:first-child {
      border-right: 1px solid silver;
      text-align: right;
    }
    th {
     	 border-bottom: 2px solid silver;
    }
    td {
      font-family: monospace;
    }
    th, td {
      padding: 4px;
    }
  </style>
</head>
<body>

  <div class="container"></div>
  <script>
  var groupBy = function(xs, accessor) {
    return xs.reduce(function(rv, x) {
      (rv[accessor(x)] = rv[accessor(x)] || []).push(x);
      return rv;
    }, {});
  };

  var rnd = d3.random.normal(1.0, 0.3);
	var data = d3.range(100).map(function(d, i){ return ~~(Math.abs(rnd())*100); });
  var dataGroups = groupBy(data, function(d){ return ~~(d/10); });
  console.log(JSON.stringify(data));

  var table = d3.select('.container')
  	.append('table');
  table.selectAll('th').data(['stem', 'leaf'])
  	.enter().append('th')
  	.text(function(d){ return d; });

  table.selectAll('tr')
    .data(d3.keys(dataGroups).map(function(d, i){ return [d, dataGroups[d]]; }))
  	.enter().append('tr')
  	.selectAll('td')
	  .data(function(d){ return d; })
  	.enter().append('td')
  	.text(function(d, i, pI){
			return !i ? d : d.map(function(dB, i){
        return parseInt(dB.toString().slice(-1));
      }).sort().join(' ');
  	});

  </script>
</body>