A basic HTML bar chart. Part of the Let’s Make a Bar Chart tutorial.
forked from mbostock's block: Bar Chart I
license: |
A basic HTML bar chart. Part of the Let’s Make a Bar Chart tutorial.
forked from mbostock's block: Bar Chart I
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<style type="text/css"> | |
.chart div { | |
font: 10px san-serif; | |
background-color: steelblue; | |
text-align: right; | |
padding: 3px; | |
margin: 1px; | |
color: white; | |
} | |
</style> | |
<div class="chart"></div> | |
<script src="//d3js.org/d3.v3.min.js"></script> | |
<script> | |
var data = [4,8,15,16,23,42]; | |
var x = d3.scale.linear() | |
.domain([0,d3.max(data)]) | |
.range([0,420]); | |
d3.select(".chart") | |
.selectAll("div") | |
.data (data) | |
.enter().append("div") | |
.style("width", function(d){ return x(d) + "px";}) | |
.text(function(d) {return d;}); | |
</script> |