sangltdn / flot

Automatically exported from code.google.com/p/flot
MIT License
0 stars 0 forks source link

Added hook to be able to add new graphs with the given series of data. #270

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
Hi, My name is Ricardo, I'm using your very good Flot code to display some 
simple graphs, but then I got a request to implement trendlines.

At first it wasn't difficult to add it in my own codes.
But then I started thinking about putting that into a Flot plugin.

But while I was working on it I realized there's no hook that lets you add 
series to the graphs, let me explain:

Imagine I pass a series to Flot like: [[0,0],[1,1],[2,2]]
Now what I want to do is to add a NEW line using *somehow* this first series.
In this case I wanted to add the trendline, so I realized that the hooks 
doesn't allow you to ADD series to a graph.

What I did is to add a new hook "processParsedData" that fires at the end 
of the loop of parseData function (line 253 of flot 0.6), that hook 
receives (plot, series, data):
-plot doesn't need explanation
-series is the array of series of each graph (in this case I got 
[[[0,0],[1,1],[2,2]]])
-data is the current serie iterating to the hook.

So this allow me to develop a plugin that will be triggered for each 
explicit given series to the graph, in case you have 3 graphs, you will add 
one trendline for each one (or as many new series as you want).

I'm pasting the changed code as I don't know how to do diffs :)
Hope its ok.

jquery.flot.js (v 0.6)
    hooks = {
        processOptions: [],
++      processParsedData: [],
        processRawData: [],
        processDatapoints: [],
        draw: [],
        bindEvents: [],
        drawOverlay: []
    },
--------
    function parseData(d) {
        var res = [];
        for (var i = 0; i < d.length; ++i) {
            var s = $.extend(true, {}, options.series);

            if (d[i].data) {
                s.data = d[i].data; // move the data instead of deep-copy
                delete d[i].data;

                $.extend(true, s, d[i]);

                d[i].data = s.data;
            } else {
                s.data = d[i];
            }
            res.push(s);
++          executeHooks(hooks.processParsedData, [res, s.data]);
        }

        return res;
    }

And I'll attach my trendline plugin.

BTW I know there's a patch for trendlines, but I really think its nice to 
be able to add new series on-the-fly with plugins.
Let me know what you think.

Original issue reported on code.google.com by ricar...@gmail.com on 4 Dec 2009 at 7:16

Attachments:

GoogleCodeExporter commented 9 years ago
Some fixes are required for this plugin to work (see attached patch):
1) do not add/subtract dx - it causes issues on grapths with multiple series 
when some series do not start from x=0
2) $.extend shoud extend {} - not opts.series (in place) - this causes to 
display trend only for last serie
3) minor: reuse n variable for length

Original comment by marooned...@gmail.com on 5 Apr 2011 at 2:57

Attachments:

GoogleCodeExporter commented 9 years ago
And one change more.
ns = $.extend(true, {}, opts.series, { data:[[x0,y0],[x1,y1]], label: 'trend', 
bars: defaultOther, lines: defaultLine, points:defaultOther, color: 
series[series.length-1].color } );

color: series[series.length-1].color

so trend has the same color as serie - even when some pervious series will be 
disabled/hidden

Original comment by marooned...@gmail.com on 5 Apr 2011 at 4:52

GoogleCodeExporter commented 9 years ago
97804, and 96153 and 
96154, respectively); 
• Subsequent hospital care services

Original comment by bbell...@gmail.com on 6 Apr 2011 at 9:27

GoogleCodeExporter commented 9 years ago
Hi there!

I was looking at this, it's getting a bit complicated. I'm wondering why you 
can't use processRawData? I think that generally, you'd probably want to access 
cleaned data actually, but also have the data you insert go through the data 
cleaner. We should possibly refactor the data stuff somewhat so one can control 
it directly.

Original comment by olau%iol...@gtempaccount.com on 8 Sep 2011 at 12:31

GoogleCodeExporter commented 9 years ago

Original comment by dnsch...@gmail.com on 23 May 2012 at 1:08