Flat-Gauge-JS

a flat design gauges js library.

designed by Or Sabag

No jQuery required
standalone
No d3 required
standalone

Spinner

var spinner = new FlatGauge.Spinner(element, options);


toggle spinner

Options:

var options = { rotationSpeed: 1000, title: { text: 'Spinning' }, highlight: true }
spinner.update(options);

Tune

var tune = new FlatGauge.Tune(element, options);
needle
left
rigth
icon

Options:

var options =
tune.update(options);

Multi-Tune

var multitune = new FlatGauge.MultiTune(element, options);
needle
left
rigth
icon

Options:

var options =
multitune.update(options);

Timer

var timer = new FlatGauge.Timer(element, options);

Options:

{ animationDuration: 500, time: { hours: 2, minutes: 45, seconds: 3 }, percentage: 33 }

AM-PM (not ready yet!)

var ampm = new FlatGauge.AmPm(element, options);


Options:

{ rotationSpeed: 1000 }

Range

var range = new FlatGauge.Range(element, options);

Options:

{ title: { text: 'range' }, showEdges: false, minMaxVal: { min: 25, max: 75 }, highlight: true, hideBottom: true }