README 1.72 KB
Newer Older
Michael's avatar
Michael committed
1
CurvedLines is a plugin for flot, which displays lines in a smooth curved way. This is achieved by adding additional points in between the "real" data points. See the test files for examples.
Michael Zinsmaier's avatar
Michael Zinsmaier committed
2

Michael's avatar
Michael committed
3
The plugin is based on nergal.dev's work and gives you an option to display curved lines. I further extended the code with a 2nd mode, which forces the lines to have their minima/maxima on the original data points.
Michael Zinsmaier's avatar
Michael Zinsmaier committed
4 5 6

Feel free to add additional features and correct errors.

Michael's avatar
Michael committed
7 8 9
Regards Michael


Michael's avatar
Michael committed
10
Update
Michael's avatar
Michael committed
11
added tests/Issue18.htm with a better explanation of the curvePointFactor
Michael's avatar
Michael committed
12
and fitPointDist parameter!
Michael's avatar
Michael committed
13

Michael's avatar
Michael committed
14 15 16 17
   
   
   
    how to use it:
Michael's avatar
Michael committed
18 19 20 21 22 23 24
    ____________________________________________________

    var d1 = [[5,5],[7,3],[9,12]];

    var options = { series: { curvedLines: {  active: true }}};

    //you might want to adjust curvePointFactor 
Michael's avatar
Michael committed
25 26
    $.plot($("#placeholder"), [{data = d1, lines: { show: true}, 
                                curvedLines: {apply: true}}], options);
Michael's avatar
Michael committed
27 28 29

     _____________________________________________________

Michael's avatar
Michael committed
30
     options:
Michael's avatar
Michael committed
31 32 33 34
     _____________________________________________________

     active:           bool true => plugin can be used
     apply:            bool true => series will be drawn as curved line
Michael's avatar
Michael committed
35 36 37 38 39 40 41
     fit:              bool true => forces the max,mins of the curve to
                                    be on the datapoints
     curvePointFactor  int  defines how many "virtual" points are used per "real" data
                                point to emulate the curvedLines (points total = real
                                points * curvePointFactor)
     fitPointDist:     int  defines the x axis distance of the additional two points
                                that are used to enforce the min max condition.