Strip chart showing last entries

[ryan...@gmail.com]

I use Flot as a strip chart front end for a lab experiment, and hacked up a way to show the latest returned reading for each series (see attached photo).

I did this with a hack:

                                // insert checkboxes
                                var j = 0;
                                var choiceContainer = $("#choices");
                                $.each(datasets, function(key, val) {

                                        //feel free to hate me here...        
                                        if($("#id"+key).length==0){
                                                choiceContainer.append("<br/><div style='background-color:"+ coloring[j++] +"'><input type='checkbox' name='" + key +
                                                        "' checked='checked' id='id" + key + "'></input>" +
                                                        "<label for='id" + key + "'>"
                                                        + val.label + "<div class='lastReading' id='lastReading"+key+"'></div></label></div>");
                                        }

                                        //update lastReading inside label
                                        //http://stackoverflow.com/questions/11832914/round-to-at-most-2-decimal-places-in-javascript#12830454
                                        var lastReading=parseFloat(datasets[key]["data"][0][1]).toFixed(2);
                                        $('#lastReading'+key).html(lastReading);
                                });

but would like to implement it by appending to the base class Plot() and allowing options to be passed to it.  I am still new at Javascript and am getting used to adding methods to classes.  Can anyone point me in the right direction regarding how they would get started?

Thanks!

[Ced]

Sorry if I missed the point, it wasn't totally clear to me exactly what you're trying to do.

I wouldn't recommend modifying or extending flot's code unless it's absolutely necessary.  Flot is already quite extensible through hooks and plugins.  In your case, I think what you're looking for are flot's hook functions.  https://github.com/flot/flot/blob/master/API.md#hooks

Here is an example of using a hook function to accomplish similar results to your code:
http://jsfiddle.net/6y76ucvg/

[ryan...@gmail.com]

Thank you!  This is a more preferred way to implement the functionality than my HTML hack.  I will develop it from here.

By "strip chart", I meant a chart that updates in real time as it gets data from a detector via an ajax call (see gif).  An output of the latest readings is helpful in case the series diverge (e.g., one is at 1 Kelvin and the other 300 Kelvin) and the grid lines aren't fine enough to distinguish the reading for the middle series.  See attached animated gif.