Skip to content


Subversion checkout URL

You can clone with
Download ZIP
A dashboard for Graphite
JavaScript Ruby
branch: master

This branch is 1 commit ahead, 183 commits behind ripienaar:master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.


A simple Graphite dashboard built using Twitters Bootstrap.

Adding new dashboards is very easy and individual graphs is described using a small DSL.

See the sample directory for an example dashboard including a screenshot.


This dashboard is a Sinatra application, I suggest deploying it in Passenger or other Sinatra application server.

A sample is included, you should adjust the url to your Graphite etc in there.

templatedir = File.join(File.dirname(__FILE__), "graph_templates")

run"", templatedir, "My Dashboard")

The SinatraApp class can take a number of arguments:

* Where graphite is installed
* The directory that has your _dashboards_ directory full of templates
* The title to show at the top of your Graphite
* A prefix to prepend to all URLs in the dashboard
* How many columns of graphs to create, 2 by default.
* The width of the graphs, 500 by default
* The height of the graphs, 250 by default
* Where your whisper files are stored - future use

Creating Dashboards?

Simply create a sub directory with a short name for your new dashboard under the templatedir.

You need a file called dash.yaml in there, here is a sample:

:name: Email Metrics
:description: Hourly metrics for the email system

Then create descriptions in files like cpu.graph in the same directory, here is a sample:

title       "Combined CPU Usage"
vtitle      "percent"
area        :stacked
description "The combined CPU usage for all Exim Anti Spam servers"

field :iowait, :scale => 0.001,
               :color => "red",
               :alias => "IO Wait",
               :data  => "sumSeries(derivative(mw*munin.cpu.iowait))"

field :system, :scale => 0.001,
               :color => "orange",
               :alias => "System",
               :data  => "sumSeries(derivative(mw*.munin.cpu.system))"

field :user, :scale => 0.001,
             :color => "yellow",
             :alias => "User",
             :data  => "sumSeries(derivative(mw*.munin.cpu.user))"

The dashboard will use the description field to show popup information bubbles when someone hovers over a graph with their mouse for 2 seconds.

The main graph properties are:

* title - Main graph title
* vtitle - Vertical graph title
* area - Graphs stacked, either :all, :first, :none
* description - Textual description of the graph, show as mouse over popupts
* width - The graph width
* height - The graph height
* from - Standard Graphite from specification like _-1hour_

The individual graphs fields can have the following properties:

* :scale - A scale to apply to the data
* :data - A raw Graphite data item that you can obtain using the normal browser
* :derivative - Should the graph be wrapped in _derivative()_
* :line - Draw a vertical line whenever data is found
* :alias - The name to show in the legend
* :color - The graph color

Graph items are added to the graph in order that they appear in this file

Full Screen Displays?

You can reuse your dashboards for big displays against a wall in your NOC or office by using the following url structure:

This will display the email dashboard in 4 columns each graph with a width of 600 and a height of 300

The screen will refresh every minute


R.I.Pienaar / / / @ripienaar

Something went wrong with that request. Please try again.