A basic HTML bar chart. Part of the Let’s Make a Bar Chart tutorial.
forked from mbostock's block: Bar Chart I
license: gpl-3.0 |
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> | |
.chart div { | |
font: 10px sans-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, 10]; | |
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> |