mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
heatmap: test for Y axis rendering
This commit is contained in:
parent
72e313a3dd
commit
7770c38e30
@ -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 = `
|
||||
<div class="heatmap-wrapper">
|
||||
<div class="heatmap-canvas-wrapper">
|
||||
@ -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']);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user