Permalink
Browse files

Allow adding a title to a graph. This sort of goes with the axis labe…

…l stuff that's still in the works.
  • Loading branch information...
1 parent 154c85c commit 7ecd23c4f905d61080cabef73f5bf61a04c02445 @rfunduk committed Aug 4, 2008
Showing with 24 additions and 2 deletions.
  1. +3 −1 examples/setting-options.html
  2. +21 −1 jquery.flot.js
@@ -58,7 +58,9 @@
color: "#BBB",
axis: 'x' } ],
backgroundColor: "#fffaff"
- }
+ },
+ title: "Graph Settings Demo",
+ titleColor: "purple"
});
});
</script>
View
@@ -112,6 +112,9 @@
mode: null, // one of null, "x", "y" or "xy"
color: "#e8cfac"
},
+ title: null,
+ titleFontSize: 20,
+ titleColor: 'black',
shadowSize: 4,
sortData: true
};
@@ -130,7 +133,8 @@
workarounds = {},
// buffer constants
RIGHT_SIDE_BUFFER = 10,
- BOTTOM_SIDE_BUFFER = 10;
+ BOTTOM_SIDE_BUFFER = 10,
+ TOP_SIDE_BUFFER = 20;
this.setData = setData;
this.setupGrid = setupGrid;
@@ -795,6 +799,10 @@
plotWidth = canvasWidth - plotOffset.left - plotOffset.right - RIGHT_SIDE_BUFFER;
+ if (options.title) {
+ plotOffset.top += TOP_SIDE_BUFFER;
+ }
+
// set width for labels; to avoid measuring the widths of
// the labels, we construct fixed-size boxes and put the
// labels inside them, the fixed-size boxes are easy to
@@ -974,6 +982,18 @@
}
function insertAxisLabels() {
+ if (options.title) {
+ yLocation = plotOffset.top - options.titleFontSize * 1.25;
+ xLocation = plotOffset.left;
+ color = options.titleColor ? options.titleColor : options.grid.color;
+ titleDiv = $("<div id='graph_title' style='color:" + color +
+ ";text-align:center;position:absolute;top:" + yLocation +
+ "px;left:" + xLocation + "px;font-weight:bold;font-size:" +
+ options.titleFontSize + "px;width:" + plotWidth + "px;'>" +
+ options.title + "</div>");
+ target.append(titleDiv);
+ }
+
if (options.xaxis.label) {
yLocation = plotOffset.top + plotHeight + (xaxis.labelHeight * 1.5);
xLocation = plotOffset.left;

0 comments on commit 7ecd23c

Please sign in to comment.