diff --git a/src/app/components/require.config.js b/src/app/components/require.config.js
index 29a320f10c8..e987b4cbf73 100644
--- a/src/app/components/require.config.js
+++ b/src/app/components/require.config.js
@@ -37,6 +37,8 @@ require.config({
'jquery.flot.stack': '../vendor/jquery/jquery.flot.stack',
'jquery.flot.stackpercent':'../vendor/jquery/jquery.flot.stackpercent',
'jquery.flot.time': '../vendor/jquery/jquery.flot.time',
+ 'jquery.flot.byte': '../vendor/jquery/jquery.flot.byte',
+
modernizr: '../vendor/modernizr-2.6.1',
elasticjs: '../vendor/elasticjs/elastic-angular-client',
@@ -66,6 +68,7 @@ require.config({
// simple dependency declaration
'jquery-ui': ['jquery'],
'jquery.flot': ['jquery'],
+ 'jquery.flot.byte': ['jquery', 'jquery.flot'],
'jquery.flot.pie': ['jquery', 'jquery.flot'],
'jquery.flot.events': ['jquery', 'jquery.flot'],
'jquery.flot.selection':['jquery', 'jquery.flot'],
diff --git a/src/app/panels/histogram/editor.html b/src/app/panels/histogram/editor.html
index 15490701bb4..d3192e6914d 100644
--- a/src/app/panels/histogram/editor.html
+++ b/src/app/panels/histogram/editor.html
@@ -16,6 +16,9 @@
+
+
+
diff --git a/src/app/panels/histogram/module.js b/src/app/panels/histogram/module.js
index 6d33242c17b..5abcee6e12f 100644
--- a/src/app/panels/histogram/module.js
+++ b/src/app/panels/histogram/module.js
@@ -39,6 +39,7 @@ define([
'jquery.flot.events',
'jquery.flot.selection',
'jquery.flot.time',
+ 'jquery.flot.byte',
'jquery.flot.stack',
'jquery.flot.stackpercent'
],
@@ -116,6 +117,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
options : true,
derivative : false,
scale : 1,
+ y_as_bytes : true,
tooltip : {
value_type: 'cumulative',
query_as_alias: true
@@ -506,7 +508,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
yaxis: {
show: scope.panel['y-axis'],
min: scope.panel.grid.min,
- max: scope.panel.percentage && scope.panel.stack ? 100 : scope.panel.grid.max,
+ max: scope.panel.percentage && scope.panel.stack ? 100 : scope.panel.grid.max
},
xaxis: {
timezone: scope.panel.timezone,
@@ -526,6 +528,10 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
}
};
+ if(scope.panel.y_as_bytes) {
+ options.yaxis.mode = "byte";
+ }
+
if(scope.panel.annotate.enable) {
options.events = {
levels: 1,
diff --git a/src/vendor/jquery/jquery.flot.byte.js b/src/vendor/jquery/jquery.flot.byte.js
new file mode 100644
index 00000000000..063e0750327
--- /dev/null
+++ b/src/vendor/jquery/jquery.flot.byte.js
@@ -0,0 +1,107 @@
+(function ($) {
+ "use strict";
+
+ var options = {};
+
+ //Round to nearby lower multiple of base
+ function floorInBase(n, base) {
+ return base * Math.floor(n / base);
+ }
+
+ function init(plot) {
+ plot.hooks.processDatapoints.push(function (plot) {
+ $.each(plot.getAxes(), function(axisName, axis) {
+ var opts = axis.options;
+ if (opts.mode === "byte" || opts.mode === "byteRate") {
+ axis.tickGenerator = function (axis) {
+ var returnTicks = [],
+ tickSize = 2,
+ delta = axis.delta,
+ steps = 0,
+ tickMin = 0,
+ tickVal,
+ tickCount = 0;
+
+ //Set the reference for the formatter
+ if (opts.mode === "byteRate") {
+ axis.rate = true;
+ }
+
+ //Enforce maximum tick Decimals
+ if (typeof opts.tickDecimals === "number") {
+ axis.tickDecimals = opts.tickDecimals;
+ } else {
+ axis.tickDecimals = 2;
+ }
+
+ //Count the steps
+ while (Math.abs(delta) >= 1024) {
+ steps++;
+ delta /= 1024;
+ }
+
+ //Set the tick size relative to the remaining delta
+ while (tickSize <= 1024) {
+ if (delta <= tickSize) {
+ break;
+ }
+ tickSize *= 2;
+ }
+
+ //Tell flot the tickSize we've calculated
+ if (typeof opts.minTickSize !== "undefined" && tickSize < opts.minTickSize) {
+ axis.tickSize = opts.minTickSize;
+ } else {
+ axis.tickSize = tickSize * Math.pow(1024,steps);
+ }
+
+ //Calculate the new ticks
+ tickMin = floorInBase(axis.min, axis.tickSize);
+ do {
+ tickVal = tickMin + (tickCount++) * axis.tickSize;
+ returnTicks.push(tickVal);
+ } while (tickVal < axis.max);
+
+ return returnTicks;
+ };
+
+ axis.tickFormatter = function(size, axis) {
+ var ext, steps = 0;
+
+ while (Math.abs(size) >= 1024) {
+ steps++;
+ size /= 1024;
+ }
+
+
+ switch (steps) {
+ case 0: ext = " B"; break;
+ case 1: ext = " KiB"; break;
+ case 2: ext = " MiB"; break;
+ case 3: ext = " GiB"; break;
+ case 4: ext = " TiB"; break;
+ case 5: ext = " PiB"; break;
+ case 6: ext = " EiB"; break;
+ case 7: ext = " ZiB"; break;
+ case 8: ext = " YiB"; break;
+ }
+
+
+ if (typeof axis.rate !== "undefined") {
+ ext += "/s";
+ }
+
+ return (size.toFixed(axis.tickDecimals) + ext);
+ };
+ }
+ });
+ });
+ }
+
+ $.plot.plugins.push({
+ init: init,
+ options: options,
+ name: "byte",
+ version: "0.1"
+ });
+})(jQuery);
\ No newline at end of file