diff --git a/API.txt b/API.txt index d744532..d6c04ef 100644 --- a/API.txt +++ b/API.txt @@ -130,9 +130,9 @@ Customizing the legend labelBoxBorderColor: color noColumns: number position: "ne" or "nw" or "se" or "sw" - margin: number of pixels + margin: number of pixels or [x margin, y margin] backgroundColor: null or color - backgroundOpacity: number in 0.0 - 1.0 + backgroundOpacity: number between 0 and 1 container: null or jQuery object/DOM element/jQuery expression } @@ -149,14 +149,16 @@ clickable: "noColumns" is the number of columns to divide the legend table into. "position" specifies the overall placement of the legend within the plot (top-right, top-left, etc.) and margin the distance to the plot -edge. "backgroundColor" and "backgroundOpacity" specifies the +edge (this can be either a number or an array of two numbers like [x, +y]). "backgroundColor" and "backgroundOpacity" specifies the background. The default is a partly transparent auto-detected background. If you want the legend to appear somewhere else in the DOM, you can -specify "container" as a jQuery object to put the legend table into. -The "position" and "margin" etc. options will then be ignored. Note -that it will overwrite the contents of the container. +specify "container" as a jQuery object/expression to put the legend +table into. The "position" and "margin" etc. options will then be +ignored. Note that Flot will overwrite the contents of the container. +Most of the above settings do not apply diff --git a/NEWS.txt b/NEWS.txt index 23f3bd5..4fd213e 100644 --- a/NEWS.txt +++ b/NEWS.txt @@ -35,6 +35,9 @@ Changes: - Added a "plotunselected" event which is triggered when the selection is removed, see "selection" example (suggestion by Meda Ugo); +- The option legend.margin can now specify horizontal and vertical + margins independently (suggestion by someone who's annoyed). + Bug fixes: diff --git a/jquery.flot.js b/jquery.flot.js index 3880821..34d43a6 100644 --- a/jquery.flot.js +++ b/jquery.flot.js @@ -1504,16 +1504,19 @@ if (options.legend.container != null) $(options.legend.container).html(table); else { - var pos = ""; - var p = options.legend.position, m = options.legend.margin; + var pos = "", + p = options.legend.position, + m = options.legend.margin; + if (m[0] == null) + m = [m, m]; if (p.charAt(0) == "n") - pos += 'top:' + (m + plotOffset.top) + 'px;'; + pos += 'top:' + (m[1] + plotOffset.top) + 'px;'; else if (p.charAt(0) == "s") - pos += 'bottom:' + (m + plotOffset.bottom) + 'px;'; + pos += 'bottom:' + (m[1] + plotOffset.bottom) + 'px;'; if (p.charAt(1) == "e") - pos += 'right:' + (m + plotOffset.right) + 'px;'; + pos += 'right:' + (m[0] + plotOffset.right) + 'px;'; else if (p.charAt(1) == "w") - pos += 'left:' + (m + plotOffset.left) + 'px;'; + pos += 'left:' + (m[0] + plotOffset.left) + 'px;'; var legend = $('