Simple SVG sparklines

Jeremy Keith calls out for “a lightweight SVG solution for sparklines”, which seems like it would be a nice thing to have.

Like this, kinda:

Just grab http://www.kryogenix.org/random/sparkline.svg and then use it in your pages* like this:

<embed src="http://www.kryogenix.org/random/sparkline.svg?1,8,1,8,1,8" 
 width=100 height=15>

This works by having the SVG itself contain JavaScript which parses its own querystring. Therefore, you need to use <embed>, not <img>, because embedded script doesn’t run in SVGs used as images.

More in the discussion (powered by webmentions)

  • A response was written at Canvas ... (adactio.com) I like sparklines a lot. Tufte describes a sparkline as: …a small intense, simple, word-sized graphic with typographic resolution. Four years ago, I a…
  • A response was written at SVG Sparklines ... (www.kevinmarks.com) At IndieWebCamp Nürnberg this weekend, Jeremy added sparklines for his site's posting frequency. To do this he used Stuart's SVG sparkline generator (…
  • Amelia Bellamy-Royds responded at ... (twitter.com)