Forked from mbostock's Arc Tween Clock example.
The first thing I learned with this is that .selectAll() takes a CSS selector as its argument. When dealing with multiple copies of the same element, like the arcs and the red lines here (which are both svg:path elements), if you want to use transitions and separate styling then one must apply class or id attributes or something so that the CSS selectors for the two sets of transitions can be mutually independent.
The second thing is that I learned is that I hate code that puns. False punning I can stand (though the commentary below points out what I think is a false punning bug I fixed), but I'm not smart enough and/or don't have the energy to deal with three or four separate simultaneous meanings of "path" and "line" that all need to be kept in mind when reading and writing the same small chunk of code. I've been known to do this kind of thing in the past, particularly when writing Grails code, so I'll have to start being more careful to avoid creating these kinds of traps for others. On the other hand, it only takes about a second to render each iteration of the code, so some approximation of interactive development is possible. It's not instantaneous, but it's fast enough that one doesn't lose his train of thought while waiting to see how the latest version of the code will render.
