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.

I'm currently available for hire, to help you plan, architect, and build new systems, and for technical writing and articles. You can take a look at some projects I've worked on and some of my writing. If you'd like to talk about your upcoming project, do get in touch.

More in the discussion (powered by webmentions)

  • A response was written at Canvas sparklines (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... (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 tag:twitter.... (twitter.com)
  • James' Coffee Blog responded at as days... (jamesg.coffee)