mkaz.blog

xkcd graph style in d3

I saw an article on Hacker News about duplicating the xkcd hand-drawn graph style saw I thought I would give it a shot using d3 javascript library. I have very limited experience with d3 but think I came up with something relatively close.

xkcd-graph-example

View live example, or See Source

View source of the live example to see the code, the key is adding a jitter to the equation to give the hand-drawn look. I also used a hand drawn font I found at xkcdsucks forum