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 config.ru is included, you should adjust the url to your Graphite etc in there.
templatedir = File.join(File.dirname(__FILE__), "graph_templates") run GDash::SinatraApp.new("http://graphite.example.net/", 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
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