A Flot plugin to make charting easy and efficient.
A chart takes as input data points at different times, accumulates them into an internal buffer (called a history buffer) of certain size and shows them as a continous graph.
Once included in the webpage the plugin is activated by specifing a history buffer to use as a data series
var buffer = new HistoryBuffer(256, 1); // 256 samples, and a single data serie.
plot = $.plot("#placeholder", [], {
series: {
historyBuffer: buffer,
lines: {
show: true
}
};Then you add data to the history buffer
buffer.push(7); // append a number to the buffer
buffer.appendArray([1, 2, 3, 4]); // or append an array to the bufferA chart redraw is automatically scheduled in the next Animation Frame on any history buffer change.
A history buffer is a data structure designed to accelerate common operations needed by charting.
See HistoryBuffer.md
Insertion of an element into a history buffer is a constant time operation O(1). Appending an array of length n to a history buffer is a linear time operation O(n).
See here how it works.
The complexity of drawing a chart of width P pixels with a history buffer of length N, of which M are newly added elements is O(p)*O(log(N))*O(M logM)