Sparkline ChartsDemo

S
Sparklines is a JQuery plugin that generates so called sparklines (small inline charts) directly in the browser using data supplied either inline in the HTML, or via javascript. We love Sparklines and use this plugin in different ways in our theme. Working example of sparklines chart in ORB is horisontal menu at the top of the content container. The plugin is compatible with most modern browsers. Each example displayed you can meet at ORB Theme takes just only one line of HTML or javascript to generate. Wonderfull!

Inline 10,8,9,3,5,8,5 line graphs 8,4,0,0,0,0,1,4,4,10,10,10,10,0,0,0,4,6,5,9,10

Bar charts 10,8,9,3,5,8,5 negative values: -3,1,2,0,3,-1 stacked: 0:2,2:4,4:2,4:1

Composite inline 8,4,0,0,0,0,1,4,4,10,10,10,10,0,0,0,4,6,5,9,10

Inline with normal range 8,4,0,0,0,0,1,4,4,10,10,10,10,0,0,0,4,6,5,9,10

Composite bar 4,6,7,7,4,3,2,1,4

Pie charts 1,1,2 1,5 20,50,80

Discrete 4,6,7,7,4,3,2,1,4,4,5,6,7,6,6,2,4,5
Discrete with threshold 4,6,7,7,4,3,2,1,4

Tristate chart using a colour map: 1,2,0,2,-1,-2,1,-2,0,0,1,1

Box Plot: 4,27,34,52,54,59,61,68,78,82,85,87,91,93,100

Bullet charts
10,12,12,9,7, 14,12,12,9,7, 10,12,14,9,7

Chart.jsCool charts

C
hart.js is easy, object oriented client side graphs for designers and developers. We can visualise data in different ways. Each of them animated, fully customisable and look great, even on retina displays. Chart.js uses the HTML5 canvas element. It supports all modern browsers. The main advantage of Chart.js is dependency free, lightweight (4.5k when minified and gzipped) and loads of customisation options. The problem with Chart.js that is not fully responsible within a box, so use it carefully. We are fully stylise these charts to make em compartible with ORB Theme.