Giter Club home page Giter Club logo

leonardo's Introduction

Leonardo

Build Status

A Graphite Dashboard, massively inspired by the excellent GDash made by ripienaar

It was rewritten in Python.

Differences with Gdash :

  • Configuration is in full YAML instead of a DSL.
  • Ability to display multiple dashboards on a single page for comparison
  • Zoom in/out
  • Graph inclusion allows globbing

Sample dashboard

Installation

This dashboard is a Flask application. Have a look at this documentation if you want to deploy it in a production environment.

If you just want to play with it, simply install dependencies and launch the run script:

# pip install pyyaml
# pip install flask
# ./run.py

If you want to run tests:

# pip install nose
# nosetests

remember to make sure there is an empty 'graphs' directory in the root directory for testing.

Test environment with Docker and Fig (now docker-compose)

You can run a fully functionnal test environment with Graphite, Collectd and Leonardo.

# vi fig.yml

change the GRAPHITE_SERVER variable to your docker host IP address. If you use boot2docker, you can get it with :

# boot2docker ip

Then build your leonardo container :

# fig build

Now run the full environment :

# fig up

This will launch a collectd container that will send your CPU metrics to a carbon/graphite container. then it will launch your Leonardo container. You can then open your browser to :

open http://$(boot2docker ip):5000

Configuration

Main configuration example is included in config/leonardo.yaml.example, you should rename it to leonardo.yaml and adjust the main options here.

Two config options are mandatory in leonardo.yaml:

* graphite: put your Graphite server url there
* templatedir: directory where your dashboards are.

and additional options:

* The title to show at the top of your Dashboard
* How many columns of graphs to create, 3 by default.
* How often dashboard page is refreshed, 30 sec by default.
* The width of the graphs, 450 by default
* The height of the graphs, 220 by default
* Optional interval quick filters

Creating Dashboards

You can have multiple top level categories of dashboard. Just create directories in the templatedir for each top level category.

In each top level category create a sub directory with a short name for each new dashboard.

You need a file called dash.yaml for each dashboard, here is a sample:

name: Server-1
description: Main System Metrics for server-1

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

title: Combined CPU Usage
vtitle: percent
area: stacked
description: The combined CPU usage

fields:
    iowait: 
        color: red
        alias: IO Wait
        data: sumSeries(collectd.server-1.cpu.*.cpu.wait.value)
        cacti_style: si

    system:
        color: orange
        alias: System
        data: sumSeries(collectd.server-1.cpu.*.cpu.system.value)
        cacti_style: si

    user:
        color: 4169E1
        alias: User
        data: sumSeries(collectd.server-1.cpu.*.cpu.user.value)
        cacti_style: si

Template Directory Layout

The directory layout is such that you can have many groupins of dashboards each with many dashboards underneath it, an example layout of your templates dir would be:

    graph_templates
    `-- virtualization
        |-- dom0
        |   |-- dash.yaml
        |   |-- iowait.graph
        |   |-- load.graph
        |   |-- system.graph
        |   |-- threads.graph
        |   `-- user.graph
        `-- kvm1
            |-- dash.yaml
            |-- disk_read.graph
            |-- disk_write.graph
            |-- ssd_read.graph
            `-- ssd_write.graph

Here we have a group of dashboards called 'virtualization' with 2 dashboards inside it each with numerous graphs.

You can create as many groups as you want each with many dashboards inside.

Custom Time Intervals

You can reuse your dashboards and adjust the time interval by using the following url structure:

http://gdash.example.com/System/Server-1/?from=-8d&until=-7d

This will display the email dashboard with a time interval same day last week.

Quick interval filters shown in interface are configurable in leonardo.yaml options sections. Eg:

options:
  interval_filters:
    - label: 30 minutes
      from: -30min
      to: now
    - label: 24 hours
      from: -1day
    - label: 1 week
      from: -7day
    - label: 1 month
      from: -30day
    - label: 1 year
      from: -1year

Time Intervals Display

If you configure time intervals in the config file you can click on any graph in the main dashboard view and get a view with different time intervals of the same graph

options:
    intervals:
        - [ "-1hour", "1 hour" ]
        - [ "-2hour", "2 hour" ]
        - [ "-1day", "1 day" ]
        - [ "-1month", "1 month" ]
        - [ "-1year", "1 year" ]

With this in place in the leonardo.yaml clicking on a graph will show the 5 intervals defined above of that graph

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:

http://gdash.example.com/System/Server-1/?full=yes

This is how it looks :

fullscreen dashboard

Include graphs from other dashboard

You can include the graphs from other dashboard with the include property in dash.yaml. You can also use globbing :

include_graphs:
- templates/os.basic
- templates/os.nfs
- System/Server-*/cpu.graph

Load dashboard properties from a external YAML file

If you got a set of common properties that you want to reuse in the dashboard, you can load a external yaml file from in dash.yaml. The path is relative to the templatedir and it does not support recursive includes.

Examples are a list of server colors, timezones, etc. In dash.yaml:

include_properties: 
 - common.yml
 - black-theme.yml

Example common.yml:

graph_properties: 
    timezone:         Europe/London
    hide_legend:      false

Example black-theme.yml:

graph_properties: 
    background_color: white
    foreground_color: black
    vertical_mark_color: "#330000"

Additional Features on Leonardo

I wrote Leonardo to be able to add features that I find useful in a production environment :

Multiple Dashboards

You can use regexps in the search box to display multiple Dashboards at the same time. That way you can compare dashboards with each other, which is very useful for instance when comparing several server metrics :

Multiple Dashboards

Zoom in/out

Using the + / - buttons on a dashboard, you can zoom in or out. The number of columns will adapt automatically :

Zoomed in

Zoomed out

Logging

The logging is configurable via options in the config/leonardo.yaml. There are options for logging to stdout, files, syslog, and email.

Examples:

  • Logging to stdout
logging:
  - stdout:
      level: debug
  • Logging to a file
logging:
  - file:
     filename: /path/to/log/file
     level: info
  • Logging to syslog
logging:
  - syslog:
      level: debug
  • Logging to email
logging:
  - email:
     mailhost: example.com
     fromaddr: [email protected]
     toaddrs:
       - [email protected]
       - [email protected]
     subject: example message
     level: error

Dark/Light Theme

Add "theme: dark" to options in leonardo.yaml to switch Leonardo to dark mode :

options:
	theme: dark	

Dark dashboard

leonardo's People

Watchers

 avatar  avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.