protovis part 2: lines and labels

Labeling the Bars

Lets add labels to the bars. Put your cursor after the left property but before the semicolon and hit return. Type .anchor("top").

This sets the anchor point of the label to the top of the bars. Now type .add(pv.Label) and you can see the data labels appear just below the top of the bars. Type .textBaseline("bottom") to move the labels above the anchor point.

That's better but all those numbers make the chart harder to read. So lets write something to make only the larges data label visible.

Type .visible(function (d). Then type d >= 1.6. This means d is greater than or equal to 1.6. You can adjust this at any time. For example, change 1.6 to 1.5 to make the lables for the top two bars visible.

Change the font by copying the font property from the tick lines and pasting it after the bar's visible property. Change the point size to 9.