add multibar support to flot library

based on patches from:
  http://code.google.com/p/flot/issues/detail?id=159

2 files changed, 17 insertions, 7 deletions

diff --git a/android_benchmark_views_app/static/js/jquery.flot.js b/android_benchmark_views_app/static/js/jquery.flot.js
index e25dbed..b3977ef 100644
--- a/android_benchmark_views_app/static/js/jquery.flot.js
+++ b/android_benchmark_views_app/static/js/jquery.flot.js
@@ -620,13 +620,16 @@
             }
 
             // give the hooks a chance to run
+            var bars_total_width = 0;
             for (i = 0; i < series.length; ++i) {
                 s = series[i];
                 
                 executeHooks(hooks.processDatapoints, [ s, s.datapoints]);
+                bars_total_width += s.bars.barWidth;
             }
 
             // second pass: find datamax/datamin for auto-scaling
+            var bar_offset = 0;
             for (i = 0; i < series.length; ++i) {
                 s = series[i];
                 points = s.datapoints.points,
@@ -661,8 +664,12 @@
                 }
                 
                 if (s.bars.show) {
+                    //store barLeft to prevent recalculation allowing overwrite in procDatapoints hook.
+                    if (s.bars.barLeft == undefined)
+                        s.bars.barLeft= s.bars.align == "left" ? bar_offset : bar_offset-bars_total_width/2;
+                    bar_offset += s.bars.barWidth;
                     // make sure we got room for the bar on the dancing floor
-                    var delta = s.bars.align == "left" ? 0 : -s.bars.barWidth/2;
+                    var delta = s.bars.barLeft;
                     if (s.bars.horizontal) {
                         ymin += delta;
                         ymax += delta + s.bars.barWidth;
@@ -1788,7 +1795,6 @@
             ctx.restore();
         }
 
-
         function insertAxisLabels() {
             var addRotateLabelStyles = function(styles,axis){
                 var b = '';
@@ -2318,7 +2324,11 @@
                 for (var i = 0; i < points.length; i += ps) {
                     if (points[i] == null)
                         continue;
-                    drawBar(points[i], points[i + 1], points[i + 2], barLeft, barRight, offset, fillStyleCallback, axisx, axisy, ctx, series.bars.horizontal, series.bars.lineWidth);
+
+                    b = points[i+2]
+                    if (series.errorBars)
+                        b = 0; //the third argument is just for the error bar
+                    drawBar(points[i], points[i + 1], b, barLeft, barRight, offset, fillStyleCallback, axisx, axisy, ctx, series.bars.horizontal, series.bars.lineWidth);
                 }
             }
 
@@ -2328,7 +2338,7 @@
             // FIXME: figure out a way to add shadows (for instance along the right edge)
             ctx.lineWidth = series.bars.lineWidth;
             ctx.strokeStyle = series.color;
-            var barLeft = series.bars.align == "left" ? 0 : -series.bars.barWidth/2;
+            var barLeft = series.bars.barLeft;
             var fillStyleCallback = series.bars.fill ? function (bottom, top) { return getFillStyle(series.bars, series.color, bottom, top); } : null;
             plotBars(series.datapoints, barLeft, barLeft + series.bars.barWidth, 0, fillStyleCallback, series.xaxis, series.yaxis);
             ctx.restore();
@@ -2481,7 +2491,7 @@
                 }
                     
                 if (s.bars.show && !item) { // no other point can be nearby
-                    var barLeft = s.bars.align == "left" ? 0 : -s.bars.barWidth/2,
+                    var barLeft = s.bars.barLeft,
                         barRight = barLeft + s.bars.barWidth;
                     
                     for (j = 0; j < points.length; j += ps) {
@@ -2671,8 +2681,7 @@
             octx.lineWidth = series.bars.lineWidth;
             octx.strokeStyle = $.color.parse(series.color).scale('a', 0.5).toString();
             var fillStyle = $.color.parse(series.color).scale('a', 0.5).toString();
-            var barLeft = series.bars.align == "left" ? 0 : -series.bars.barWidth/2;
-            drawBar(point[0], point[1], point[2] || 0, barLeft, barLeft + series.bars.barWidth,
+            drawBar(point[0], point[1], point[2] || 0, series.bars.barLeft, series.bars.barLeft + series.bars.barWidth,
                     0, function () { return fillStyle; }, series.xaxis, series.yaxis, octx, series.bars.horizontal, series.bars.lineWidth);
         }
 
diff --git a/android_benchmark_views_app/templates/android_benchmark_views_app/report.html b/android_benchmark_views_app/templates/android_benchmark_views_app/report.html
index 1fb5e25..e5ed57b 100644
--- a/android_benchmark_views_app/templates/android_benchmark_views_app/report.html
+++ b/android_benchmark_views_app/templates/android_benchmark_views_app/report.html
@@ -62,6 +62,7 @@
 	  var options = {
             series: {stack: 0,
               multipleBars: true,
+              errorBars: true,
               bars: {show: true, barWidth: .95/{{runs|length}}, align: 'center',},
               points: {show: true, radius: 5},
             },