mobeets/README.md

## README.md

      
    Raw
  

              README.md
            
          
    The above 13 character repeat patterns account for 50% of English words (117893 of 235786 words, using nltk's corpus.words).

  
## data.csv

          
            name
            desc
            value

            
              AABCDEFG
               occident
               13155

            
              AABCDEFGH
               milkgrass
               11979

            
              AABCDEF
               crowtoe
               11021

            
              AABBCDEFGH
               improperly
               10006

            
              AABBCDEFG
               upsitting
               9699

            
              ABCDEF
               larigo
               8459

            
              AABCDEFGHI
               wantonlike
               8330

            
              ABCDEFG
               dogface
               8225

            
              AABBCDEFGHI
               overcleanly
               7915

            
              AABCDE
               bleery
               7362

            
              AABBCDEF
               milliare
               6661

            
              ABCDE
               sixer
               6647

            
              ABCDEFGH
               nailshop
               6336

            
              AABBCDEFGHIJ
               excursionism
               4776

## index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Popular character repeat patterns</title>
    <script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script>
    <style type="text/css">

body {
  font: 12px sans-serif;
}

.bar rect {
  fill: steelblue;
  opacity: 0.8;
}

.bar text.value {
  fill: white;
}

.axis {
  shape-rendering: crispEdges;
}

.axis path {
  fill: none;
}

.x.axis line {
  stroke: #fff;
  stroke-opacity: .8;
}

.y.axis path {
  stroke: black;
}

    </style>
  </head>
  <body>
    <script type="text/javascript">

var margin = {top: 30, right: 10, bottom: 10, left: 100},
    width = 700 - margin.right - margin.left,
    height = 500 - margin.top - margin.bottom;

var format = d3.format(",.0f");

var x = d3.scale.linear()
    .range([0, width]);

var y = d3.scale.ordinal()
    .rangeRoundBands([0, height], .1);

var xAxis = d3.svg.axis()
    .scale(x)
    .orient("top")
    .tickSize(-height);

var yAxis = d3.svg.axis()
    .scale(y)
    .orient("left")
    .tickSize(0);

var svg = d3.select("body").append("svg")
    .attr("width", width + margin.right + margin.left)
    .attr("height", height + margin.top + margin.bottom)
  .append("g")
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

d3.csv("data.csv", function(data) {

  // Parse numbers, and sort by value.
  data.forEach(function(d) { d.value = +d.value; });
  data.sort(function(a, b) { return b.value - a.value; });

  // Set the scale domain.
  x.domain([0, d3.max(data, function(d) { return d.value; })]);
  y.domain(data.map(function(d) { return d.name; }));

  var bar = svg.selectAll("g.bar")
      .data(data)
    .enter().append("g")
      .attr("class", "bar")
      .attr("transform", function(d) { return "translate(0," + y(d.name) + ")"; });

  bar.append("rect")
      .attr("width", function(d) { return x(d.value); })
      .attr("height", y.rangeBand())
      .on("mouseover", function() { d3.select(this).style("opacity", 1.0); })
      .on("mouseout", function() { d3.select(this).style("opacity", 0.8); });

  bar.append("text")
      .attr("class", "value")
      .attr("x", function(d) { return x(d.value); })
      .attr("y", y.rangeBand() / 2)
      .attr("dx", -3)
      .attr("dy", ".35em")
      .attr("text-anchor", "end")
      .text(function(d) { return d.desc; });

  svg.append("g")
      .attr("class", "x axis")
      .call(xAxis);

  svg.append("g")
      .attr("class", "y axis")
      .call(yAxis);

});

    </script>
  </body>
</html>
name	desc	value
AABCDEFG	occident	13155
AABCDEFGH	milkgrass	11979
AABCDEF	crowtoe	11021
AABBCDEFGH	improperly	10006
AABBCDEFG	upsitting	9699
ABCDEF	larigo	8459
AABCDEFGHI	wantonlike	8330
ABCDEFG	dogface	8225
AABBCDEFGHI	overcleanly	7915
AABCDE	bleery	7362
AABBCDEF	milliare	6661
ABCDE	sixer	6647
ABCDEFGH	nailshop	6336
AABBCDEFGHIJ	excursionism	4776
	<!DOCTYPE html>
	<html>
	<head>
	<title>Popular character repeat patterns</title>
	<script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script>
	<style type="text/css">

	body {
	font: 12px sans-serif;
	}

	.bar rect {
	fill: steelblue;
	opacity: 0.8;
	}

	.bar text.value {
	fill: white;
	}

	.axis {
	shape-rendering: crispEdges;
	}

	.axis path {
	fill: none;
	}

	.x.axis line {
	stroke: #fff;
	stroke-opacity: .8;
	}

	.y.axis path {
	stroke: black;
	}

	</style>
	</head>
	<body>
	<script type="text/javascript">

	var margin = {top: 30, right: 10, bottom: 10, left: 100},
	width = 700 - margin.right - margin.left,
	height = 500 - margin.top - margin.bottom;

	var format = d3.format(",.0f");

	var x = d3.scale.linear()
	.range([0, width]);

	var y = d3.scale.ordinal()
	.rangeRoundBands([0, height], .1);

	var xAxis = d3.svg.axis()
	.scale(x)
	.orient("top")
	.tickSize(-height);

	var yAxis = d3.svg.axis()
	.scale(y)
	.orient("left")
	.tickSize(0);

	var svg = d3.select("body").append("svg")
	.attr("width", width + margin.right + margin.left)
	.attr("height", height + margin.top + margin.bottom)
	.append("g")
	.attr("transform", "translate(" + margin.left + "," + margin.top + ")");

	d3.csv("data.csv", function(data) {

	// Parse numbers, and sort by value.
	data.forEach(function(d) { d.value = +d.value; });
	data.sort(function(a, b) { return b.value - a.value; });

	// Set the scale domain.
	x.domain([0, d3.max(data, function(d) { return d.value; })]);
	y.domain(data.map(function(d) { return d.name; }));

	var bar = svg.selectAll("g.bar")
	.data(data)
	.enter().append("g")
	.attr("class", "bar")
	.attr("transform", function(d) { return "translate(0," + y(d.name) + ")"; });

	bar.append("rect")
	.attr("width", function(d) { return x(d.value); })
	.attr("height", y.rangeBand())
	.on("mouseover", function() { d3.select(this).style("opacity", 1.0); })
	.on("mouseout", function() { d3.select(this).style("opacity", 0.8); });

	bar.append("text")
	.attr("class", "value")
	.attr("x", function(d) { return x(d.value); })
	.attr("y", y.rangeBand() / 2)
	.attr("dx", -3)
	.attr("dy", ".35em")
	.attr("text-anchor", "end")
	.text(function(d) { return d.desc; });

	svg.append("g")
	.attr("class", "x axis")
	.call(xAxis);

	svg.append("g")
	.attr("class", "y axis")
	.call(yAxis);

	});

	</script>
	</body>
	</html>