backup tgids master
[scannr.git] / js / flotr2 / README.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
Flotr2
======

The Canvas graphing library.

![Google Groups](http://groups.google.com/intl/en/images/logos/groups_logo_sm.gif)

http://groups.google.com/group/flotr2/

Please fork http://jsfiddle.net/cesutherland/ZFBj5/ with your question or bug reproduction case.


API
---

The API consists of a primary draw method which accepts a configuration object, helper methods, and several microlibs.

### Example

```javascript
  var
    // Container div:
    container = document.getElementById("flotr-example-graph"),
    // First data series:
    d1 = [[0, 3], [4, 8], [8, 5], [9, 13]],
    // Second data series:
    d2 = [],
    // A couple flotr configuration options:
    options = {
      xaxis: {
        minorTickFreq: 4
      }, 
      grid: {
        minorVerticalLines: true
      }
    },
    i, graph;

  // Generated second data set:
  for (i = 0; i < 14; i += 0.5) {
    d2.push([i, Math.sin(i)]);
  }

  // Draw the graph:
  graph = Flotr.draw(
    container,  // Container element
    [ d1, d2 ], // Array of data series
    options     // Configuration options
  );
```

### Microlibs

* [underscore.js](http://documentcloud.github.com/underscore/)
* [bean.js](https://github.com/fat/bean)

Extending
---------

Flotr may be extended by adding new plugins and graph types.

### Graph Types

Graph types define how a particular chart is rendered.  Examples include line, bar, pie.

Existing graph types are found in `js/types/`.

### Plugins

Plugins extend the core of flotr with new functionality.  They can add interactions, new decorations, etc.  Examples 
include titles, labels and selection.

The plugins included are found in `js/plugins/`.

Development
-----------

This project uses [smoosh](https://github.com/fat/smoosh) to build and [jasmine](http://pivotal.github.com/jasmine/) 
with [js-imagediff](https://github.com/HumbleSoftware/js-imagediff) to test.  Tests may be executed by 
[jasmine-headless-webkit](http://johnbintz.github.com/jasmine-headless-webkit/) with 
`cd spec; jasmine-headless-webkit -j jasmine.yml -c` or by a browser by navigating to 
`flotr2/spec/SpecRunner.html`.

Shoutouts
---------

Thanks to Bas Wenneker, Fabien Ménager and others for all the work on the original Flotr.
Thanks to Jochen Berger and Jordan Santell for their contributions to Flotr2.