Skip to content

Instantly share code, notes, and snippets.

@Anirudhk94

Anirudhk94/index.html

Created February 4, 2019 19:12
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Anirudhk94/1cd5d386085ef5e85be37e2c52eaec33 to your computer and use it in GitHub Desktop.
Save Anirudhk94/1cd5d386085ef5e85be37e2c52eaec33 to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source https://jsbin.com/xatazu
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
<title>JS Bin</title>
</head>
<body>
<script id="jsbin-javascript">
var h = 100
var w = 500
var padding = 2
var dataset = [5,10,15,20,25]
var svg = d3.select("body")
.append("svg")
.attr("height", h)
.attr("width", w)
svg.selectAll("rect")
.data(dataset)
.enter()
.append("rect")
.attr("x", function(d, i) {return i * w/dataset.length;})
.attr("y", function(d) {return h - (d * 4);})
.attr("height", function(d) {return d * 4;})
.attr("width", function(d, i) {return w / dataset.length - padding;})
</script>
<script id="jsbin-source-javascript" type="text/javascript">var h = 100
var w = 500
var padding = 2
var dataset = [5,10,15,20,25]
var svg = d3.select("body")
.append("svg")
.attr("height", h)
.attr("width", w)
svg.selectAll("rect")
.data(dataset)
.enter()
.append("rect")
.attr("x", function(d, i) {return i * w/dataset.length;})
.attr("y", function(d) {return h - (d * 4);})
.attr("height", function(d) {return d * 4;})
.attr("width", function(d, i) {return w / dataset.length - padding;})
</script></body>
</html>
Raw
jsbin.xatazu.js
var h = 100
var w = 500
var padding = 2
var dataset = [5,10,15,20,25]
var svg = d3.select("body")
.append("svg")
.attr("height", h)
.attr("width", w)
svg.selectAll("rect")
.data(dataset)
.enter()
.append("rect")
.attr("x", function(d, i) {return i * w/dataset.length;})
.attr("y", function(d) {return h - (d * 4);})
.attr("height", function(d) {return d * 4;})
.attr("width", function(d, i) {return w / dataset.length - padding;})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment