r22801 - gnucash/trunk/src/report/report-system - Charts: improve tooltips on line and bar charts
Geert Janssens
gjanssens at code.gnucash.org
Thu Feb 21 11:51:40 EST 2013
Author: gjanssens
Date: 2013-02-21 11:51:40 -0500 (Thu, 21 Feb 2013)
New Revision: 22801
Trac: http://svn.gnucash.org/trac/changeset/22801
Modified:
gnucash/trunk/src/report/report-system/html-barchart.scm
gnucash/trunk/src/report/report-system/html-linechart.scm
gnucash/trunk/src/report/report-system/html-piechart.scm
gnucash/trunk/src/report/report-system/html-scatter.scm
Log:
Charts: improve tooltips on line and bar charts
Modified: gnucash/trunk/src/report/report-system/html-barchart.scm
===================================================================
--- gnucash/trunk/src/report/report-system/html-barchart.scm 2013-02-21 16:51:31 UTC (rev 22800)
+++ gnucash/trunk/src/report/report-system/html-barchart.scm 2013-02-21 16:51:40 UTC (rev 22801)
@@ -365,6 +365,7 @@
(push (gnc:html-js-include "jqplot/jquery.jqplot.js"))
(push (gnc:html-js-include "jqplot/jqplot.barRenderer.js"))
(push (gnc:html-js-include "jqplot/jqplot.categoryAxisRenderer.js"))
+ (push (gnc:html-js-include "jqplot/jqplot.highlighter.js"))
(push (gnc:html-js-include "jqplot/jqplot.canvasTextRenderer.js"))
(push (gnc:html-js-include "jqplot/jqplot.canvasAxisTickRenderer.js"))
(push (gnc:html-css-include "jqplot/jquery.jqplot.css"))
@@ -429,6 +430,9 @@
yaxis: {
autoscale: true,
},
+ },
+ highlighter: {
+ tooltipContentEditor: formatTooltip,
}
};\n")
@@ -471,50 +475,15 @@
(push "$.jqplot.config.enablePlugins = true;")
(push "var plot = $.jqplot('placeholder', data, options);
- function showTooltip(x, y, contents) {
- $('<div id=\"tooltip\">' + contents + '</div>').css( {
- position: 'absolute',
- display: 'none',
- top: y + 5,
- left: x + 5,
- border: '1px solid #fdd',
- padding: '2px',
- 'background-color': '#fee',
- opacity: 0.80
- }).appendTo(\"body\").fadeIn(200);
- }
+ function formatTooltip(str, seriesIndex, pointIndex) {
+ if (options.axes.xaxis.ticks[pointIndex] !== undefined)
+ x = options.axes.xaxis.ticks[pointIndex];
+ else
+ x = pointIndex;
+ y = data[seriesIndex][pointIndex][1].toFixed(2);
+ return options.series[seriesIndex].label + ' ' + x + '<br><b>' + y + '</b>';
+ }\n")
- var previousPoint = null;
-
- function graphHighlightHandler(evt, seriesIndex, pointIndex, data) {
- var item = [seriesIndex, pointIndex];
- if (seriesIndex != undefined && pointIndex != undefined) {
- if (previousPoint != item) {
- previousPoint = item;
-
- $(\"#tooltip\").remove();
- var x = data[0].toFixed(2),
- y = data[1].toFixed(2);
-
- if (options.axes.xaxis.ticks[pointIndex] !== undefined)
- x = options.axes.xaxis.ticks[pointIndex];
-
- var offsetX = 0;//(plot.getAxes().xaxis.scale * item.series.bars.barWidth);
- showTooltip(evt.pageX + offsetX, evt.pageY,
- options.series[seriesIndex].label + \" of \" + x + \"<br><b>\" + y + \"</b>\");
- // <small>(+100.00)</small>
- }
- } else {
- $(\"#tooltip\").remove();
- previousPoint = null;
- }
- }
-
- $(\"#placeholder\").bind(\"jqplotDataHighlight\", graphHighlightHandler);
- $(\"#placeholder\").bind(\"jqplotDataUnhighlight\", graphHighlightHandler);
-
- ")
-
(push "});\n</script>")
(gnc:msg (string-join (reverse (map (lambda (e) (if (number? e) (number->string e) e)) retval)) ""))
Modified: gnucash/trunk/src/report/report-system/html-linechart.scm
===================================================================
--- gnucash/trunk/src/report/report-system/html-linechart.scm 2013-02-21 16:51:31 UTC (rev 22800)
+++ gnucash/trunk/src/report/report-system/html-linechart.scm 2013-02-21 16:51:40 UTC (rev 22801)
@@ -395,6 +395,7 @@
(begin
(push (gnc:html-js-include "jqplot/jquery.min.js"))
(push (gnc:html-js-include "jqplot/jquery.jqplot.js"))
+ (push (gnc:html-js-include "jqplot/jqplot.highlighter.js"))
(push (gnc:html-js-include "jqplot/jqplot.canvasTextRenderer.js"))
(push (gnc:html-js-include "jqplot/jqplot.canvasAxisTickRenderer.js"))
(push (gnc:html-css-include "jqplot/jquery.jqplot.css"))
@@ -455,6 +456,10 @@
yaxis: {
autoscale: true,
},
+ },
+ highlighter: {
+ tooltipContentEditor: formatTooltip,
+ tooltipLocation: 'ne',
}
};\n")
@@ -495,50 +500,15 @@
(push "$.jqplot.config.enablePlugins = true;")
(push "var plot = $.jqplot('placeholder', data, options);
- function showTooltip(x, y, contents) {
- $('<div id=\"tooltip\">' + contents + '</div>').css( {
- position: 'absolute',
- display: 'none',
- top: y + 5,
- left: x + 5,
- border: '1px solid #fdd',
- padding: '2px',
- 'background-color': '#fee',
- opacity: 0.80
- }).appendTo(\"body\").fadeIn(200);
- }
+ function formatTooltip(str, seriesIndex, pointIndex) {
+ if (options.axes.xaxis.ticks[pointIndex] !== undefined)
+ x = options.axes.xaxis.ticks[pointIndex][1];
+ else
+ x = pointIndex;
+ y = data[seriesIndex][pointIndex][1].toFixed(2);
+ return options.series[seriesIndex].label + ' ' + x + '<br><b>' + y + '</b>';
+ }\n")
- var previousPoint = null;
-
- function graphHighlightHandler(evt, seriesIndex, pointIndex, data) {
- var item = [seriesIndex, pointIndex];
- if (seriesIndex != undefined && pointIndex != undefined) {
- if (previousPoint != item) {
- previousPoint = item;
-
- $(\"#tooltip\").remove();
- var x = data[0].toFixed(2),
- y = data[1].toFixed(2);
-
- if (options.axes.xaxis.ticks[pointIndex] !== undefined)
- x = options.axes.xaxis.ticks[pointIndex];
-
- var offsetX = 0;//(plot.getAxes().xaxis.scale * item.series.bars.barWidth);
- showTooltip(evt.pageX + offsetX, evt.pageY,
- options.series[seriesIndex].label + \" of \" + x + \"<br><b>$\" + y + \"</b>\");
- // <small>(+100.00)</small>
- }
- } else {
- $(\"#tooltip\").remove();
- previousPoint = null;
- }
- }
-
- $(\"#placeholder\").bind(\"jqplotDataHighlight\", graphHighlightHandler);
- $(\"#placeholder\").bind(\"jqplotDataUnhighlight\", graphHighlightHandler);
-
- ")
-
(push "});\n</script>")
(gnc:msg (string-join (reverse (map (lambda (e) (if (number? e) (number->string e) e)) retval)) ""))
Modified: gnucash/trunk/src/report/report-system/html-piechart.scm
===================================================================
--- gnucash/trunk/src/report/report-system/html-piechart.scm 2013-02-21 16:51:31 UTC (rev 22800)
+++ gnucash/trunk/src/report/report-system/html-piechart.scm 2013-02-21 16:51:40 UTC (rev 22801)
@@ -250,8 +250,8 @@
(push " options.title += \" (")
(push subtitle) (push ")\";\n")))
- (push "$.jqplot.config.enablePlugins = true;")
- (push "var plot = $.jqplot('placeholder', [data], options);")
+ (push "$.jqplot.config.enablePlugins = true;\n")
+ (push "var plot = $.jqplot('placeholder', [data], options);\n")
(push "});\n</script>"))
(begin (gnc:warn "null-data, not rendering piechart")
" "))
Modified: gnucash/trunk/src/report/report-system/html-scatter.scm
===================================================================
--- gnucash/trunk/src/report/report-system/html-scatter.scm 2013-02-21 16:51:31 UTC (rev 22800)
+++ gnucash/trunk/src/report/report-system/html-scatter.scm 2013-02-21 16:51:40 UTC (rev 22801)
@@ -220,8 +220,8 @@
(push "\";\n")))
- (push "$.jqplot.config.enablePlugins = true;")
- (push "var plot = $.jqplot('placeholder', [data], options);")
+ (push "$.jqplot.config.enablePlugins = true;\n")
+ (push "var plot = $.jqplot('placeholder', [data], options);\n")
(push "});\n</script>"))
(begin
More information about the gnucash-changes
mailing list