Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Looks good, updated API and so on. Fixed the link in the interacting …

…example to point to the correct excanvas file... Shocking is that this doesn't work in IE yet, bug fixing and such will get done for that eventually, feel free to help out with that.
  • Loading branch information...
commit b61d0af37e1a01a1982c57baa4c783e661732edd 1 parent c0ae6e0
@rfunduk authored
View
29 API.txt
@@ -57,6 +57,7 @@ The format of a single series object is as follows:
lines: specific lines options,
bars: specific bars options,
points: specific points options,
+ hints: specific hints options,
shadowSize: number
}
@@ -402,6 +403,15 @@ Customizing the data series
markerWidth: number
markerColor: color (defaults to lineColor)
}
+
+ hints: {
+ showColorBox: boolean
+ showSeriesLabel: boolean
+ labelFormatter: fn: or leave it alone to get the defalt
+ hintFormatter: fn: or leave it alone to get the defalt
+ backgroundColor: color or null (for auto-detect)
+ backgroundOpacity: number
+ }
colors: [ color1, color2, ... ]
@@ -450,6 +460,25 @@ compared against. For example, perhaps you want to show the temperature each
day and delta the datapoint against the yearly average on that day (or
against another city, etc).
+"hints" are essentially tooltips that get formatted according to the format
+function assigned to either an individual series or to all hints. The function
+should return a string. Here are the default formatters:
+
+ function defaultHintFormatter(x, y) {
+ return "<strong>x:</strong> " + x.toFixed(2) +
+ " <strong>y:</strong> " + y.toFixed(2);
+ }
+
+ function defaultLabelFormatter(label) {
+ return "<span style='font-size:1.2em;'>" + label + "</span>";
+ }
+
+'defaultHintFormatter' is the formatter for the actual datapoint.
+'defaultLabelFormatter' is the formatter for the series label. 'showColorBox'
+is whether the color of the series will appear in the tooltip like it does
+in the legend. 'showSeriesLabel' is whether the label of the series is inserted
+into the hint at all.
+
Customizing the grid
====================
View
3  NEWS.txt
@@ -1,3 +1,6 @@
+*** Giving up updating this changelog in favor of just following the
+ commits on github. This file will be removed in the future.
+
Flot 0.5
--------
View
3  README.txt
@@ -21,7 +21,8 @@ you take the one bundled with Flot as it contains a bugfix for drawing
filled shapes) which is canvas emulation on Internet Explorer. You can
include the excanvas script like this:
- <!--[if IE]><script language="javascript" type="text/javascript" src="excanvas.pack.js"></script><![endif]-->
+ <!--[if IE]><script language="javascript" type="text/javascript"
+ src="excanvas.pack.js"></script><![endif]-->
If it's not working on your development IE 6.0, check that it has
support for VML which excanvas is relying on. It appears that some
View
5 TODO
@@ -11,7 +11,6 @@ grid configuration
selection
- user should be able to cancel selection with escape
- - select points
interactive zooming
- convenience zoom(x1, y1, x2, y2)? and zoomOut() (via zoom stack)?
@@ -30,10 +29,6 @@ labels
- plan "all points" option
- interactive "label this point" command
-interactive hover over
- - fire event with value for points
- - fire event with graph id for lines
-
error margin indicators
- for scientific/statistical purposes
View
9 examples/interacting.html
@@ -5,7 +5,7 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Flot Examples</title>
<link href="interacting_files/layout.css" rel="stylesheet" type="text/css">
- <!--[if IE]><script language="javascript" type="text/javascript" src="excanvas.pack.js"></script><![endif]-->
+ <!--[if IE]><script language="javascript" type="text/javascript" src="../excanvas.pack.js"></script><![endif]-->
<script language="javascript" type="text/javascript" src="../jquery.js"></script>
<script language="javascript" type="text/javascript" src="../jquery.flot.js"></script>
</head><body>
@@ -25,10 +25,12 @@
for (var i = 0; i < 14; i += 0.5)
d2.push([i, Math.cos(i)]);
- plot = $.plot($("#placeholder"), [ { data:d1, label: "test"}, d2 ], {
+ plot = $.plot($("#placeholder"), [ { data: d1, label: "Yellow" },
+ { data: d2, label: "Blue" } ], {
hints: { show: true },
points: { show: true },
lines: { show: true },
+ legend: { position: 'sw' },
grid: {
clickable: true,
hoverable: true,
@@ -47,9 +49,6 @@
$("#placeholder").bind("plotmousemove", function (e, pos) {
if (!pos.selected) { return; }
plot.highlightSelected( pos.selected );
- x = pos.selected.x.toFixed(2);
- y = pos.selected.y.toFixed(2);
- $("#result").text('You hovered over (' + x + ', ' + y + ')');
});
});
</script>
View
4 jquery.flot.js
@@ -103,8 +103,8 @@ BOTTOM_SIDE_BUFFER = 5;
showSeriesLabel: true,
labelFormatter: defaultLabelFormatter,
hintFormatter: defaultHintFormatter,
- backgroundColor: null, // null means auto-detect
- backgroundOpacity: 0.95 // set to 0 to avoid background
+ backgroundColor: "black", // null means auto-detect
+ backgroundOpacity: 0.1 // set to 0 to avoid background
},
selection: {
mode: null, // one of null, "x", "y" or "xy"
Please sign in to comment.
Something went wrong with that request. Please try again.