diff --git a/API.md b/API.md index 2e536da..1350a7c 100644 --- a/API.md +++ b/API.md @@ -281,12 +281,12 @@ deprecated and scheduled to be removed with the release of version 1.0.0. To enable more granular control over styles, labels are divided between a set of text containers, with each holding the labels for one axis. These containers -are given the classes 'flot-text', 'flot-[x|y]-axis', and 'flot-[x|y]#-axis', -where '#' is the number of the axis when there are multiple axes. For example, -the x-axis labels for a simple plot with only one x-axis might look like this: +are given the classes 'flot-[x|y]-axis', and 'flot-[x|y]#-axis', where '#' is +the number of the axis when there are multiple axes. For example, the x-axis +labels for a simple plot with only a single x-axis might look like this: ```html -
+
January 2013
...
diff --git a/jquery.flot.js b/jquery.flot.js index 8b008ff..2f11d43 100644 --- a/jquery.flot.js +++ b/jquery.flot.js @@ -38,16 +38,6 @@ Licensed under the MIT license. var hasOwnProperty = Object.prototype.hasOwnProperty; - // Add default styles for tick labels and other text - - $(function() { - $("head").prepend([ - "" - ].join("")); - }); - /////////////////////////////////////////////////////////////////////////// // The Canvas object is a wrapper around an HTML5 tag. // @@ -109,6 +99,7 @@ Licensed under the MIT license. // Collection of HTML div layers for text overlaid onto the canvas + this.textContainer = null; this.text = {}; // Cache of text fragments and metrics, so we can avoid expensively @@ -228,8 +219,25 @@ Licensed under the MIT license. // Create the text layer if it doesn't exist if (layer == null) { + + // Create the text layer container, if it doesn't exist + + if (this.textContainer == null) { + this.textContainer = $("
") + .css({ + position: "absolute", + top: 0, + left: 0, + bottom: 0, + right: 0, + 'font-size': "smaller", + color: "#545454" + }) + .insertAfter(this.element); + } + layer = this.text[classes] = $("
") - .addClass("flot-text " + classes) + .addClass(classes) .css({ position: "absolute", top: 0, @@ -237,7 +245,7 @@ Licensed under the MIT license. bottom: 0, right: 0 }) - .insertAfter(this.element); + .appendTo(this.textContainer); } return layer;