Showing line with the right lineWidth in legend.

Question

I have a group of lines, with different width. I would like to show the same width of lines in the legend area, is there a way to do that? Currently, the legend only has the right color in a block (same size for all the lines.)

Answer 1

The legend is overlaid on top of the canvas so you can manipulate the css to get this functionality:

var p = $.plot(...);
$.each(p.getData(), function(i, el){ 
  $($('.legendColorBox div div')[i]).css({border: 'none', 
                                          height: el.lines.lineWidth+'px', 
                                          width: '20px', 
                                         'background-color': el.color}); 
});