protovis templates

Simple Horizontal Bar Chart

Use a bar chart to illustrate rankings or a change in units over time.

Edit, input your data

Editing the data in the file is fairly strait forward. There are two values you can edit and they are labeled "Date" and "barData". Each is followed by a colon : and a value you can change. The value following Date can be hours, days, months, years, etc. and can be a number or a string (text in quotes). The value following barData must be a number. If you are creating a ranking, it's best to enter the data in descending order.

Edit basic chart settings

The next section allows you to customize the size, positioning, color and other elements of your chart. Each is explained with a comment in green that will not affect your code.

Advanced settings

This section has information to automatically redraw the chart when the data changes. You shouldn't have to edit here with one exception. If you want to highlight a specific bar, change the activeBar number.