Rickshaw is a JavaScript Smalltalk toolkit for creating interactive time series graphs.

Rickshaw on SmalltalkHub

Graphing Toolkit

Rickshaw provides the elements you need to create interactive graphs: renderers, legends, hovers, range selectors, etc. You put the pieces together.See Demo

Built on d3.js

It's all based on d3 underneath, so graphs are drawn with standard SVG and styled with CSS. Customize all you like with techniques you already know.

Seaside integration

Rickshaw is integrated into Seaside as seamless as possible. You code Smalltalk, and the library wrapper will output the required JavaScript.

Getting started

Here's a minimal but complete working example. We start by pulling in dependencies. A few extensions require jQuery, but here all we need is d3 and the Rickshaw library itself. Instantiate a graph, and then render it. For more along this path, check out the tutorial and also see our examples listing

renderExampleGettingStartedGraphOn: var1
	self methodHasNoSourceCode

Area graph

renderExampleAreaGraphOn: var1
	self methodHasNoSourceCode
renderExampleStackedAreaGraphOn: var1
	self methodHasNoSourceCode

Lines

renderExampleLineGraphOn: var1
	self methodHasNoSourceCode
renderExampleMultipleLineGraphOn: var1
	self methodHasNoSourceCode

Bars

renderExampleBarGraphOn: var1
	self methodHasNoSourceCode
renderExampleStackedBarGraphOn: var1
	self methodHasNoSourceCode

Scatterplot

renderExampleScatterplotGraphOn: var1
	self methodHasNoSourceCode

Interactive Legend

renderExampleInteractiveLegendGraphOn: var1
	self methodHasNoSourceCode

Interactive Hover details

renderExampleHoverGraphOn: var1
	self methodHasNoSourceCode

A more interesting example