I've been thinking I should learn D3 for generating interactive visualiations of technical subjects. Here's my first script! It's based on Mike Bostok's great examples.

```
<script>
var t = 1297110663;
var v = 70;
var data = d3.range(33).map(next);
function next() {
return {
time: ++t,
value: v = ~~Math.max(10, Math.min(90, v + 10 * (Math.random() - 0.5)))
}
}
setInterval(function() {
data.shift();
data.push(next());
redraw();
}, 1500);
var w = 20;
var h = 80;
var x = d3.scale.linear()
.domain([0, 1])
.range([0, w]);
var y = d3.scale.linear()
.domain([0, 100])
.rangeRound([0, h]);
var chart = d3.select(".d3_vis").append("svg")
.attr("class","chart")
.attr("width", w*data.length-1)
.attr("height",h);
chart.selectAll("rect")
.data(data)
.enter().append("rect")
.attr("x", function(d,i) { return x(i) - 0.5; })
.attr("y", function(d) { return h - y(d.value) - 0.5; })
.attr("width",w)
.attr("height", function(d) { return y(d.value);});
chart.append("line")
.attr("x1", 0)
.attr("x2", w * data.length)
.attr("y1", h - 0.5)
.attr("y2", h - 0.5)
.style("stroke", "#000");
function redraw() {
chart.selectAll("rect")
.data(data)
.transition()
.duration(500)
.attr("y", function(d) { return h - y(d.value) - 0.5; })
.attr("height", function(d) { return y(d.value); })
}
</script>
```