Flot graph - lineWidth in realtime chart plotting

Question

I am plotting realtime graph with jquery flot, and I am running 10-15 lines in the graph [count of line is dynamic, so could be some time 20 or more], Default lineWidth is 1, and for selected one I want to change lineWidth to 3.

I changed code to set data[index].lineWidth = 3 for selected line, but its not working.

Can anyone help about it, how to change lineWidth on the fly in running realtime flot graph ?

Thanks

Answer 1

The property "lineWidth" is a member of the lines collection. Also, after you adjust your series appearance you have to make a call to plot.draw() to redraw with the new options.

For example:

$(function () {
    var d1 = [];
     for (var i = 0; i < 14; i += 0.5)
         d1.push([i, Math.sin(i)]);

     var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];

     // a null signifies separate line segments
     var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];

     var somePlot = $.plot($("#placeholder"), [ d1, d2, d3 ]);

    somePlot.getData()[1].lines.lineWidth = 20;
    somePlot.draw();

});