kpq/index.html

## index.html
<!DOCTYPE html>
<meta charset="utf-8">

<style type="text/css">

  body {
    font-family: arial, sans;
    font-size: 11px;
    width: 720px;
    margin: 30px auto;
  }

  svg {
    border: 1px solid #f0f;
  }

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

</style>

<body>
<div class="g-chart"></div>
</body>

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script>

<script type="text/javascript">

var margin = {top: 20, right: 50, bottom: 20, left: 10};

var width = 720 - margin.left - margin.right,
    height = 400 - margin.top - margin.bottom;

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

d3.tsv("jobs.tsv", ready);

function ready(error, jobsData) {
  if (error) return console.warn(error);

  jobsData.forEach(function(d) {
    d.jobs_change = +d.jobs_change;
    d.animal = "cow";

  });

  var rect = svg.selectAll("rect")
    .data(jobsData)
    .enter().append("rect")
    .attr("class", "jobs-rect");

}


</script>
	<!DOCTYPE html>
	<meta charset="utf-8">

	<style type="text/css">

	body {
	font-family: arial, sans;
	font-size: 11px;
	width: 720px;
	margin: 30px auto;
	}

	svg {
	border: 1px solid #f0f;
	}

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

	</style>

	<body>
	<div class="g-chart"></div>
	</body>

	<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script>

	<script type="text/javascript">

	var margin = {top: 20, right: 50, bottom: 20, left: 10};

	var width = 720 - margin.left - margin.right,
	height = 400 - margin.top - margin.bottom;

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

	d3.tsv("jobs.tsv", ready);

	function ready(error, jobsData) {
	if (error) return console.warn(error);

	jobsData.forEach(function(d) {
	d.jobs_change = +d.jobs_change;
	d.animal = "cow";

	});

	var rect = svg.selectAll("rect")
	.data(jobsData)
	.enter().append("rect")
	.attr("class", "jobs-rect");

	}



	</script>