a cute little graphing library
JavaScript Ruby
Pull request Compare This branch is 2 commits ahead of camerond:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.



A cute little graphing library with an adorably minimal amount of functionality.

Visit http://jquery-graphie.heroku.com for examples.

Using graphie

  • Include Raphael and the plugin.
  • Call $.graphie() on any <dl>, <ul> or <ol> that contains numeric values, or on a <table> whose <tr>’s have two <td> elements containing numeric values for x and y coordinates, respectively.
  • Graphie will add a class of 'graphie' on any object that it draws within, allowing you to set dimensions & background color of that object in CSS.

Options (defaults shown)

  type: 'line',             // can be either 'line', 'column' or 'x_line'
  line: {
    bgcolor: '#5ad0ea',     // Background color of line/columns. Set to false for no background.
    smoothing: 'auto',      // You can set an arbitrary line smoothing value here (number without 'px'). Change to 0 for straight lines.
    column_width: 'auto'    // You can set an arbitrary width here (number without 'px').
    stroke: '#5ad0ea'       // Stroke color
    stroke_width: 0         // Stroke width. Looks best with no bgcolor.
  labels: {
    x: 5,                   // Label distance from sides
    y: 5,                   // Label distance from bottom
    color: '#000',          // These
    family: 'Helvetica',    // are
    weight: 'bold',         // obvious,
    size: 12                // right?