summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorIgor Sfiligoi <isfiligoi@ucsd.edu>2011-08-24 22:00:04 -0400
committerIgor Sfiligoi <isfiligoi@ucsd.edu>2011-08-24 22:00:04 -0400
commit003de268bc19b84ecc0c76736a102ee8cbef0a8b (patch)
treeba9e5504f0cbfa193f36bb3f04f2225d4f41bb9c
parentaf26aaa53d073a7b2d25caee93e1cb5ceb2e099c (diff)
flot-0.6-tooltip-0.4.2flot-0.6
-rw-r--r--README.tooltip.txt5
l---------jquery.flot.tooltip.js1
l---------jquery.flot.tooltip.min.js1
-rw-r--r--jquery.flot.tooltip_0.4.2.js146
-rw-r--r--jquery.flot.tooltip_0.4.2.min.js3
5 files changed, 156 insertions, 0 deletions
diff --git a/README.tooltip.txt b/README.tooltip.txt
new file mode 100644
index 0000000..79f5457
--- /dev/null
+++ b/README.tooltip.txt
@@ -0,0 +1,5 @@
+Tooltip is a plugin that is provided outside the standard Flot package.
+
+More details can be found at
+https://github.com/krzysu/flot.tooltip/
+
diff --git a/jquery.flot.tooltip.js b/jquery.flot.tooltip.js
new file mode 120000
index 0000000..70ecb05
--- /dev/null
+++ b/jquery.flot.tooltip.js
@@ -0,0 +1 @@
+jquery.flot.tooltip_0.4.2.js \ No newline at end of file
diff --git a/jquery.flot.tooltip.min.js b/jquery.flot.tooltip.min.js
new file mode 120000
index 0000000..77201bf
--- /dev/null
+++ b/jquery.flot.tooltip.min.js
@@ -0,0 +1 @@
+jquery.flot.tooltip_0.4.2.min.js \ No newline at end of file
diff --git a/jquery.flot.tooltip_0.4.2.js b/jquery.flot.tooltip_0.4.2.js
new file mode 100644
index 0000000..d29085e
--- /dev/null
+++ b/jquery.flot.tooltip_0.4.2.js
@@ -0,0 +1,146 @@
+/*
+ * jquery.flot.tooltip
+ *
+ * desc: create tooltip with values of hovered point on the graph,
+ support many series, time mode,
+ you can set custom tip content (also with use of HTML tags) and precision of values
+ * version: 0.4.2
+ * author: Krzysztof Urbas @krzysu [myviews.pl]
+ * website: https://github.com/krzysu/flot.tooltip
+ *
+ * released under MIT License, 2011
+*/
+
+(function ($) {
+ var options = {
+ tooltip: false, //boolean
+ tooltipOpts: {
+ content: "%s | X: %x | Y: %y.2", //%s -> series label, %x -> X value, %y -> Y value, %x.2 -> precision of X value
+ dateFormat: "%y-%0m-%0d",
+ shifts: {
+ x: 10,
+ y: 20
+ },
+ defaultTheme: true
+ }
+ };
+
+ function init(plot) {
+
+ var tipPosition = {x: 0, y: 0};
+ var opts = plot.getOptions();
+
+ function updateTooltipPosition(pos) {
+ tipPosition.x = pos.x;
+ tipPosition.y = pos.y;
+ };
+
+ function onMouseMove(e) {
+
+ var pos = {x: 0, y: 0};
+ pos.x = e.pageX;
+ pos.y = e.pageY;
+
+ updateTooltipPosition(pos);
+ };
+
+ function timestampToDate(tmst) {
+
+ var theDate = new Date(tmst);
+
+ return $.plot.formatDate(theDate, opts.tooltipOpts.dateFormat);
+ };
+
+ plot.hooks.bindEvents.push(function (plot, eventHolder) {
+
+ var to = opts.tooltipOpts;
+ var placeholder = plot.getPlaceholder();
+ var $tip;
+
+ if (opts.tooltip === false) return;
+
+ if( $('#flotTip').length > 0 ){
+ $tip = $('#flotTip');
+ }
+ else {
+ $tip = $('<div />').attr('id', 'flotTip');
+ $tip.appendTo('body').hide().css({position: 'absolute'});
+
+ if(to.defaultTheme) {
+ $tip.css({
+ 'background': '#fff',
+ 'z-index': '100',
+ 'padding': '0.4em 0.6em',
+ 'border-radius': '0.5em',
+ 'font-size': '0.8em',
+ 'border': '1px solid #111'
+ });
+ }
+ }
+
+ $(placeholder).bind("plothover", function (event, pos, item) {
+ if (item) {
+ var tipText;
+
+ if(opts.xaxis.mode === "time" || opts.xaxes[0].mode === "time") {
+ tipText = stringFormat(to.content, item, timestampToDate);
+ }
+ else {
+ tipText = stringFormat(to.content, item);
+ }
+
+ $tip.html( tipText ).css({left: tipPosition.x + to.shifts.x, top: tipPosition.y + to.shifts.y}).show();
+ }
+ else {
+ $tip.hide().html('');
+ }
+ });
+
+ eventHolder.mousemove(onMouseMove);
+ });
+
+ function stringFormat(content, item, fnct) {
+
+ var seriesPattern = /%s/;
+ var xPattern = /%x\.{0,1}(\d{0,})/;
+ var yPattern = /%y\.{0,1}(\d{0,})/;
+
+ //series match
+ if( typeof(item.series.label) !== 'undefined' ) {
+ content = content.replace(seriesPattern, item.series.label);
+ }
+ // xVal match
+ if( typeof(fnct) === 'function' ) {
+ content = content.replace(xPattern, fnct(item.datapoint[0]) );
+ }
+ else {
+ content = adjustValPrecision(xPattern, content, item.datapoint[0]);
+ }
+ // yVal match
+ content = adjustValPrecision(yPattern, content, item.datapoint[1]);
+
+ return content;
+ };
+
+ function adjustValPrecision(pattern, content, value) {
+
+ var precision;
+ if( content.match(pattern) !== 'null' ) {
+ if(RegExp.$1 !== '') {
+ precision = RegExp.$1;
+ value = value.toFixed(precision)
+ }
+ content = content.replace(pattern, value);
+ }
+
+ return content;
+ };
+ }
+
+ $.plot.plugins.push({
+ init: init,
+ options: options,
+ name: 'tooltip',
+ version: '0.4'
+ });
+})(jQuery);
diff --git a/jquery.flot.tooltip_0.4.2.min.js b/jquery.flot.tooltip_0.4.2.min.js
new file mode 100644
index 0000000..a817a95
--- /dev/null
+++ b/jquery.flot.tooltip_0.4.2.min.js
@@ -0,0 +1,3 @@
+(function(c){c.plot.plugins.push({init:function(g){var h,i;function l(a){var b=0,d=0,b=a.pageX,d=a.pageY;h=b;i=d}function m(a){return c.plot.formatDate(new Date(a),f.tooltipOpts.dateFormat)}function j(a,b,d){var c=/%s/,e=/%x\.{0,1}(\d{0,})/;typeof b.series.label!=="undefined"&&(a=a.replace(c,b.series.label));a=typeof d==="function"?a.replace(e,d(b.datapoint[0])):k(e,a,b.datapoint[0]);return a=k(/%y\.{0,1}(\d{0,})/,a,b.datapoint[1])}function k(a,b,d){var c;if(b.match(a)!=="null"){if(RegExp.$1!=="")c=
+RegExp.$1,d=d.toFixed(c);b=b.replace(a,d)}return b}h=0;i=0;var f=g.getOptions();g.hooks.bindEvents.push(function(a,b){var d=f.tooltipOpts,g=a.getPlaceholder(),e;f.tooltip!==!1&&(c("#flotTip").length>0?e=c("#flotTip"):(e=c("<div />").attr("id","flotTip"),e.appendTo("body").hide().css({position:"absolute"}),d.defaultTheme&&e.css({background:"#fff","z-index":"100",padding:"0.4em 0.6em","border-radius":"0.5em","font-size":"0.8em",border:"1px solid #111"})),c(g).bind("plothover",function(a,b,c){c?(a=f.xaxis.mode===
+"time"||f.xaxes[0].mode==="time"?j(d.content,c,m):j(d.content,c),e.html(a).css({left:h+d.shifts.x,top:i+d.shifts.y}).show()):e.hide().html("")}),b.mousemove(l))})},options:{tooltip:!1,tooltipOpts:{content:"%s | X: %x | Y: %y.2",dateFormat:"%y-%0m-%0d",shifts:{x:10,y:20},defaultTheme:!0}},name:"tooltip",version:"0.4"})})(jQuery); \ No newline at end of file