Creating a simple barplot – d3js

A working example can be found here.

<!DOCTYPE html>
	<meta charset="utf-8">
	<title>Simple bar Graph</title>
	<script src=""></script>

<div id="theSVG"></div>


// the data that sets the height
// of the bars
var dataSet=[10,12,13,74,100]

// setting the height and width of the
// svg where it will be drawn
var h=100;
var w=500;

// start d3 and tell it to make a svg
// with the above attributes (height and width)

// create the bars for the bar chart.
	// get the data from aboce
	// will repeat for each entry in data
	// and create a rectangle for each entry
	// set the height of the rectangle
		return h-d;
	// set width of rectagles
	// draw each rectangle 21px to the right.
		return i*21;
	// now we use the data to se the height
		return d;	



Leave a Reply

Please log in using one of these methods to post your comment: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s