diff --git a/public/app/plugins/panel/heatmap/specs/renderer_specs.ts b/public/app/plugins/panel/heatmap/specs/renderer_specs.ts index 2e9a6a82b4f..d94f3128339 100644 --- a/public/app/plugins/panel/heatmap/specs/renderer_specs.ts +++ b/public/app/plugins/panel/heatmap/specs/renderer_specs.ts @@ -47,9 +47,9 @@ describe('grafanaHeatmap', function () { colorScheme: 'interpolateSpectral', fillBackground: false }, - xBucketSize: null, + xBucketSize: 1000, xBucketNumber: null, - yBucketSize: null, + yBucketSize: 1, yBucketNumber: null, xAxis: { show: true @@ -85,35 +85,35 @@ describe('grafanaHeatmap', function () { var scope = $rootScope.$new(); scope.ctrl = ctrl; - let series = []; - series.push(new TimeSeries({ - datapoints: [[1422774000000, 1], [1422774060000, 2]], + ctx.series = []; + ctx.series.push(new TimeSeries({ + datapoints: [[1, 1422774000000], [2, 1422774060000]], alias: 'series1' })); - series.push(new TimeSeries({ - datapoints: [[1422774000000, 2], [1422774060000, 3]], + ctx.series.push(new TimeSeries({ + datapoints: [[2, 1422774000000], [3, 1422774060000]], alias: 'series2' })); - setupFunc(ctrl, ctx.data); - - let xBucketSize = ctrl.panel.xBucketSize; - let yBucketSize = ctrl.panel.yBucketSize; - let logBase = ctrl.panel.yAxis.logBase; - let bucketsData = convertToHeatMap(series, yBucketSize, xBucketSize, logBase); - // console.log("bucketsData", bucketsData); - ctx.data = { - buckets: bucketsData, heatmapStats: { min: 1, max: 3, minLog: 1 }, - xBucketSize: xBucketSize, - yBucketSize: yBucketSize + xBucketSize: ctrl.panel.xBucketSize, + yBucketSize: ctrl.panel.yBucketSize }; + setupFunc(ctrl, ctx); + + let logBase = ctrl.panel.yAxis.logBase; + let bucketsData = convertToHeatMap(ctx.series, ctx.data.yBucketSize, ctx.data.xBucketSize, logBase); + ctx.data.buckets = bucketsData; + + // console.log("bucketsData", bucketsData); + // console.log("series", ctrl.panel.yAxis.logBase, ctx.series.length); + let elemHtml = `
@@ -138,9 +138,7 @@ describe('grafanaHeatmap', function () { heatmapScenario('default options', function (ctx) { ctx.setup(function (ctrl) { - ctrl.panel.logBase = 1; - ctrl.panel.xBucketSize = 1000; - ctrl.panel.yBucketSize = 1; + ctrl.panel.yAxis.logBase = 1; }); it('should draw correct Y axis', function () { @@ -154,6 +152,94 @@ describe('grafanaHeatmap', function () { }); }); + heatmapScenario('when logBase is 2', function (ctx) { + ctx.setup(function (ctrl) { + ctrl.panel.yAxis.logBase = 2; + }); + + it('should draw correct Y axis', function () { + var yTicks = getTicks(ctx.element, ".axis-y"); + expect(yTicks).to.eql(['1', '2', '4']); + }); + }); + + heatmapScenario('when logBase is 10', function (ctx) { + ctx.setup(function (ctrl, ctx) { + ctrl.panel.yAxis.logBase = 10; + + ctx.series.push(new TimeSeries({ + datapoints: [[10, 1422774000000], [20, 1422774060000]], + alias: 'series3' + })); + ctx.data.heatmapStats.max = 20; + }); + + it('should draw correct Y axis', function () { + var yTicks = getTicks(ctx.element, ".axis-y"); + expect(yTicks).to.eql(['1', '10', '100']); + }); + }); + + heatmapScenario('when logBase is 32', function (ctx) { + ctx.setup(function (ctrl) { + ctrl.panel.yAxis.logBase = 32; + + ctx.series.push(new TimeSeries({ + datapoints: [[10, 1422774000000], [100, 1422774060000]], + alias: 'series3' + })); + ctx.data.heatmapStats.max = 100; + }); + + it('should draw correct Y axis', function () { + var yTicks = getTicks(ctx.element, ".axis-y"); + expect(yTicks).to.eql(['1', '32', '1 K']); + }); + }); + + heatmapScenario('when logBase is 1024', function (ctx) { + ctx.setup(function (ctrl) { + ctrl.panel.yAxis.logBase = 1024; + + ctx.series.push(new TimeSeries({ + datapoints: [[2000, 1422774000000], [300000, 1422774060000]], + alias: 'series3' + })); + ctx.data.heatmapStats.max = 300000; + }); + + it('should draw correct Y axis', function () { + var yTicks = getTicks(ctx.element, ".axis-y"); + expect(yTicks).to.eql(['1', '1 K', '1 Mil']); + }); + }); + + heatmapScenario('when Y axis format set to "none"', function (ctx) { + ctx.setup(function (ctrl) { + ctrl.panel.yAxis.logBase = 1; + ctrl.panel.yAxis.format = "none"; + ctx.data.heatmapStats.max = 10000; + }); + + it('should draw correct Y axis', function () { + var yTicks = getTicks(ctx.element, ".axis-y"); + expect(yTicks).to.eql(['0', '2000', '4000', '6000', '8000', '10000', '12000']); + }); + }); + + heatmapScenario('when Y axis format set to "second"', function (ctx) { + ctx.setup(function (ctrl) { + ctrl.panel.yAxis.logBase = 1; + ctrl.panel.yAxis.format = "s"; + ctx.data.heatmapStats.max = 3600; + }); + + it('should draw correct Y axis', function () { + var yTicks = getTicks(ctx.element, ".axis-y"); + expect(yTicks).to.eql(['0 ns', '17 min', '33 min', '50 min', '1 hour']); + }); + }); + });