bellentuck/index.html

## index.html
<!DOCTYPE html>
<html>
 <head>
   <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
   <title>Hello d3 World</title>
   <script type="text/javascript" src="http://d3js.org/d3.v2.min.js"></script>
   <link rel="stylesheet" type="text/css" href="style.css">
 </head>

 <body>
   <div id="chart">
   </div>
   <script type="text/javascript" src="index.js"></script>
 </body>
</html>

## index.js
var w = 960, h = 500,  // no scrolling necessary
svg = d3.select("#chart") // i.e., <div id="chart"> from index.html
.append("svg")
.attr("width", w)
.attr("height", h);
/*
I always use that syntax, an “svg” variable that holds the top-level svg
container, which resides in a <div> element which has an id of “chart”.
--http://www.jeromecukier.net/blog/2012/09/04/getting-to-hello-world-with-d3/
*/

var text = svg
.append("text")
.text("Hello, d3 World!")
.attr("y", 50);

## style.css

html, body {
  background-color: pink;
}

text {
  font-size: 36px;
}
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
	<title>Hello d3 World</title>
	<script type="text/javascript" src="http://d3js.org/d3.v2.min.js"></script>
	<link rel="stylesheet" type="text/css" href="style.css">
	</head>

	<body>
	<div id="chart">
	</div>
	<script type="text/javascript" src="index.js"></script>
	</body>
	</html>
	var w = 960, h = 500, // no scrolling necessary
	svg = d3.select("#chart") // i.e., <div id="chart"> from index.html
	.append("svg")
	.attr("width", w)
	.attr("height", h);
	/*
	I always use that syntax, an “svg” variable that holds the top-level svg
	container, which resides in a <div> element which has an id of “chart”.
	--http://www.jeromecukier.net/blog/2012/09/04/getting-to-hello-world-with-d3/
	*/

	var text = svg
	.append("text")
	.text("Hello, d3 World!")
	.attr("y", 50);