Alexandre Testu atestu

The result is pts won by the team / total pts. Over 50% means the game is won, and you get a sense of the intensity of the win that way.

Tampa Bay Buccaneers49%90%FALSE80%

Team	Result	Odds of winning	Verdict	Confidence
Baltimore Ravens	36%	49%	TRUE	64%
Cincinnati Bengals	47%	65%	FALSE	81%
New England Patriots	52%	92%	TRUE	83%
Miami Dolphins	70%	36%	FALSE	73%
Atlanta Falcons	43%	57%	FALSE	87%

Artsy Quilts

Artsy Quilt makes image quilts out of tag and gene pages on Artsy. It is based on the work of Edward Tufte and inspired by the ImageQuilt extension created by Tufte and Adam Schwartz.

Install it here

Let's make a bar chart... editor!

I'm a front end engineer at CB Insights. We use d3.js for almost all our visualizations, from simple bar and line charts to complex network graphs.

I wanted to share some of what I've learned but I didn't know where to start. There are a ton of d3 tutorials for newbies out there and I didn't feel like I would be able to add anything new. But after reading Mike Bostock's "Let's make a bar chart", I had an idea: I will pick up where he left off and add something new to the simple bar chart we have at the end of the last part of that tutorial:

The Pew Research Center global a survey about homosexuality last year. They asked the question "Should society accept homosexuality?"* I substracted the no's from the yes' to calculate what I call the acceptance rate.

I compared that acceptance rate to GDP per capita and found some interesting results. I'll let you make your own conclusions.

The chart was made in Numbers.

* It is important to note that this is not a survey about particular gay rights like same sex marriage, it is simply asking whether we should accept homosexuality or not.

	<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">

	<html lang="en">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>untitled</title>
	<meta name="generator" content="TextMate http://macromates.com/">
	<meta name="author" content="Alexandre Testu">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript" charset="utf-8"></script>

	<div class="social-sharing">
	<div class="fb-like" data-href="__YOUR_URL__" data-send="false" data-layout="box_count" data-width="55" data-show-faces="true"></div>
	<a href="https://twitter.com/share" class="twitter-share-button" data-url="__YOUR_URL__" data-text="__YOUR_TWEET__" data-related="__YOUR_TWITTER_ACCOUNT__" data-count="vertical">Tweet</a>
	<script src="//platform.linkedin.com/in.js" type="text/javascript"></script>
	<script type="IN/Share" data-url="__YOUR_URL__" data-counter="top"></script>
	</div>

	<script>(function(d, s, id) {
	var js, fjs = d.getElementsByTagName(s)[0];
	if (d.getElementById(id)) return;

	<!DOCTYPE html>
	<html>
	<head>
	<script src="http://d3js.org/d3.v2.js"></script>
	<script type="text/javascript" src="https://raw.github.com/d3/d3-plugins/master/force_labels/force_labels.js"></script>
	<style>
	.anchor { fill:blue}
	.labelbox { fill:black;opacity:0.8}
	.labeltext { fill:white;font-weight:bold;text-anchor:middle;font-size:16;font-family: serif}
	.link { stroke:gray;stroke-width:0.35}

	var YourViewModel = function () {
	var self = this;

	self.thing = ko.observable('');

	$.get('api/call', function (data) {
	self.thing(data);

	// thing is loaded,
	self.loaded.thing(true);

	import nfldb
	import json
	from pprint import pprint

	db = nfldb.connect()
	q = nfldb.Query(db)

	q.game(season_year=2013).player()

	print json.dumps(map(lambda pp: {

	// all of these variables are independent of the data,
	// so we exclude them from the draw function
	var margin = {top: 20, right: 30, bottom: 30, left: 40},
	width = 960 - margin.left - margin.right,
	height = 500 - margin.top - margin.bottom;

	var x = d3.scale.ordinal()
	.rangeRoundBands([0, width], .1);

	var y = d3.scale.linear()