block by milroc f2e89676b54f9bb3cb343462be9e4d66

Fitts's Bar, I

Full Screen

Typical bar charts have issues with Fitts’s law for interactions. That is that the area of the bar prevents the user from easily moving from one bar to the other. Additionally when the bars are at some minimum area (or there is no area), the user may be unable to interact with the data.

This example fixes the available interactive dimension to be the x dimension only. Allowing the interaction area of all bars to be constant. See this in action on the New York Times

See Fitts’s Bar, II for another approach.

This is also an example of how to reference two blocks for:

It’s helpful in that data and common imports (e.g: less.js, topojson, or a specific version of d3) do not have to be redundantly copied per block that is created.

forked from milroc‘s block: Fitts’s Bar, I

index.html

letter.tsv

src.js

style.css

style.less