Sparklines for Java

Introduction

Sparklines are "intense, simple, wordlike graphics." They are detailed in Edward Tufte's latest book, Beautiful Evidence and also in his message board.

Here's one showing my unique visitor history on my Javadoc search site for the past several days , or maybe you prefer a line graph: .

Software

Sparklines for Java is released under the Apache License.

The package contains a Servlet that can be added to a web project to create sparklines based on request parameters. It also includes a taglib for easily formatting the required parameters. There's also an API to directly create a BufferedImage in any Java code.

The first release (1.0) generated embedded images using data: URIs. Unfortunately, these are only really supported in Firefox, and to a lesser extent Safari and Opera. These are still supported, but have been moved to a "spark_em" taglib (also included with the distribution). For more information on using these, please see the archived release page.

Changelog

Download

Released under the Apache License.

Subversion repository

You can access the online repository:

  svn checkout http://java-spark.googlecode.com/svn/trunk/ java-spark
  

You can also search/browse the source tree online from the Google hosted code page.

Support

Sparklines for Java Google Group

You can also reach me at spark [at] representqueens [dot] com for any comments, suggestions, bugs, etc.

Installation

You'll need to include the spark.jar in your web project. Additionally, you'll need to add a mapping in web.xml for the SparkController:

    <servlet>
      <servlet-name>SparkLines</servlet-name>
      <servlet-class>com.representqueens.spark.service.SparkController</servlet-class>
    </servlet>
  

and then the servlet-mapping:

    <servlet-mapping>
      <servlet-name>SparkLines</servlet-name>
      <url-pattern>/spark</url-pattern>
    </servlet-mapping>
  

"/spark" is the default path in the taglib. If you need to use another mapping, that's fine, you can specify this when using the tag.

JSTL examples

    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
    <%@ taglib prefix="spark" uri="http://www.representqueens.com/taglibs/spark" %>
    <c:set var="test" value="5, 35, 22, 19, 16, 10, 4, 33, 9, 12, 27, 36, 22" />
    <img src="<spark:bar name="test" color="red" />" />
  

This will generate HTML source:

    <img src="/x/spark?type=bar&color=red&data=5,35,22,19,16,10,4,33,9,12,27,36,22" />
  

The default path is "/spark" (from above). The "/x" happens to be my current context, and is prepended automatically.

Though the web.xml mapping, this will hit the servlet controller and return a png image... Something like this:

If you need to specify an alternate path (you mapped the servlet to another URL), there are two ways to do this. First you can specify it as part of the taglib, like this:

    <img src="<spark:bar path="/spark2" name="test" color="red" />" />
  

Or, you can specify this in a page variable, like this:

    <c:set var="sparkPath" value="/spark3" />
    <img src="<spark:line name="test" color="red" />" />
  

Note that you should not include the context path... This is automatically prepended.

The name attribute specifies the key to find the data (Uses JspContext.findAttribute). It expects the value to be either a List<Number>, a Number[], or a String of comma separated int values. It's the only manditory attribute.

The other attributes are width, height, spacing, color, highColor, lastColor, output. You can replace "bar" with "line" to get a linegraph (note: highColor and lastColor are currently not supported for line graphs).

The color attributes can either be a color name (a field name from java.awt.Color), or a HTML hex color (e.g. #ff0000 for red).

Java Examples

final Number[] data = new Integer[] { 5, 22, 16, 8, 30, 9, 12, 27, 19, 22 };

// width, height, spacing
final SizeParams params = new SizeParams(50, 12, 1);

final BufferedImage i =
  BarGraph.createGraph(data, params,
                       Color.blue.brighter(),
                       Color.blue.darker(),
                       Color.magenta);

ImageIO.write(i, "png", new File(args[0]));

Would produce something like:

Line graphs are similar, although we currently only support a single color:

final BufferedImage i = LineGraph.createGraph(data, params, Color.blue.darker());

produces:

Sparklines Javadocs

Author

Written by Larry Ogrodnek <ogrodnek [at] gmail>.