mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Remove tests and logs
This commit is contained in:
Tobias Skarhed
parent
472b880939
commit
53bab1a84b
@ -1,20 +0,0 @@
|
||||
import React from 'react';
|
||||
import HeatmapRenderer from './rendering';
|
||||
import { HeatmapCtrl } from './heatmap_ctrl';
|
||||
|
||||
export class HeatmapRenderContainer extends React.Component {
|
||||
renderer: any;
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.renderer = HeatmapRenderer(
|
||||
this.props.scope,
|
||||
this.props.children[0],
|
||||
[],
|
||||
new HeatmapCtrl(this.props.scope, {}, {})
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
return <div />;
|
||||
}
|
||||
}
|
||||
@ -154,7 +154,7 @@ export class HeatmapRenderer {
|
||||
} else {
|
||||
timeFormat = d3.timeFormat(grafanaTimeFormatter);
|
||||
}
|
||||
console.log(ticks);
|
||||
|
||||
let xAxis = d3
|
||||
.axisBottom(this.xScale)
|
||||
.ticks(ticks)
|
||||
@ -549,7 +549,6 @@ export class HeatmapRenderer {
|
||||
.style('opacity', this.getCardOpacity.bind(this));
|
||||
|
||||
let $cards = this.$heatmap.find('.heatmap-card');
|
||||
console.log($cards);
|
||||
$cards
|
||||
.on('mouseenter', event => {
|
||||
this.tooltip.mouseOverBucket = true;
|
||||
|
||||
@ -1,351 +0,0 @@
|
||||
// import { describe, beforeEach, it, sinon, expect, angularMocks } from '../../../../../test/lib/common';
|
||||
|
||||
import '../module';
|
||||
// import angular from 'angular';
|
||||
// import $ from 'jquery';
|
||||
// import helpers from 'test/specs/helpers';
|
||||
import TimeSeries from 'app/core/time_series2';
|
||||
import moment from 'moment';
|
||||
// import { Emitter } from 'app/core/core';
|
||||
import rendering from '../rendering';
|
||||
// import * as d3 from 'd3';
|
||||
import { convertToHeatMap, convertToCards, histogramToHeatmap, calculateBucketSize } from '../heatmap_data_converter';
|
||||
jest.mock('app/core/core', () => ({
|
||||
appEvents: {
|
||||
on: () => {},
|
||||
},
|
||||
contextSrv: {
|
||||
user: {
|
||||
lightTheme: false,
|
||||
},
|
||||
},
|
||||
}));
|
||||
|
||||
describe('grafanaHeatmap', function() {
|
||||
// beforeEach(angularMocks.module('grafana.core'));
|
||||
|
||||
let scope = <any>{};
|
||||
let render;
|
||||
|
||||
function heatmapScenario(desc, func, elementWidth = 500) {
|
||||
describe(desc, function() {
|
||||
var ctx: any = {};
|
||||
|
||||
ctx.setup = function(setupFunc) {
|
||||
// beforeEach(
|
||||
// angularMocks.module(function($provide) {
|
||||
// $provide.value('timeSrv', new helpers.TimeSrvStub());
|
||||
// })
|
||||
// );
|
||||
|
||||
beforeEach(() => {
|
||||
// angularMocks.inject(function($rootScope, $compile) {
|
||||
var ctrl: any = {
|
||||
colorSchemes: [
|
||||
{
|
||||
name: 'Oranges',
|
||||
value: 'interpolateOranges',
|
||||
invert: 'dark',
|
||||
},
|
||||
{ name: 'Reds', value: 'interpolateReds', invert: 'dark' },
|
||||
],
|
||||
events: {
|
||||
on: () => {},
|
||||
emit: () => {},
|
||||
},
|
||||
height: 200,
|
||||
panel: {
|
||||
heatmap: {},
|
||||
cards: {
|
||||
cardPadding: null,
|
||||
cardRound: null,
|
||||
},
|
||||
color: {
|
||||
mode: 'spectrum',
|
||||
cardColor: '#b4ff00',
|
||||
colorScale: 'linear',
|
||||
exponent: 0.5,
|
||||
colorScheme: 'interpolateOranges',
|
||||
fillBackground: false,
|
||||
},
|
||||
legend: {
|
||||
show: false,
|
||||
},
|
||||
xBucketSize: 1000,
|
||||
xBucketNumber: null,
|
||||
yBucketSize: 1,
|
||||
yBucketNumber: null,
|
||||
xAxis: {
|
||||
show: true,
|
||||
},
|
||||
yAxis: {
|
||||
show: true,
|
||||
format: 'short',
|
||||
decimals: null,
|
||||
logBase: 1,
|
||||
splitFactor: null,
|
||||
min: null,
|
||||
max: null,
|
||||
removeZeroValues: false,
|
||||
},
|
||||
tooltip: {
|
||||
show: true,
|
||||
seriesStat: false,
|
||||
showHistogram: false,
|
||||
},
|
||||
highlightCards: true,
|
||||
},
|
||||
renderingCompleted: jest.fn(),
|
||||
hiddenSeries: {},
|
||||
dashboard: {
|
||||
getTimezone: () => 'utc',
|
||||
},
|
||||
range: {
|
||||
from: moment.utc('01 Mar 2017 10:00:00', 'DD MMM YYYY HH:mm:ss'),
|
||||
to: moment.utc('01 Mar 2017 11:00:00', 'DD MMM YYYY HH:mm:ss'),
|
||||
},
|
||||
};
|
||||
|
||||
// var scope = $rootScope.$new();
|
||||
scope.ctrl = ctrl;
|
||||
|
||||
ctx.series = [];
|
||||
ctx.series.push(
|
||||
new TimeSeries({
|
||||
datapoints: [[1, 1422774000000], [2, 1422774060000]],
|
||||
alias: 'series1',
|
||||
})
|
||||
);
|
||||
ctx.series.push(
|
||||
new TimeSeries({
|
||||
datapoints: [[2, 1422774000000], [3, 1422774060000]],
|
||||
alias: 'series2',
|
||||
})
|
||||
);
|
||||
|
||||
ctx.data = {
|
||||
heatmapStats: {
|
||||
min: 1,
|
||||
max: 3,
|
||||
minLog: 1,
|
||||
},
|
||||
xBucketSize: ctrl.panel.xBucketSize,
|
||||
yBucketSize: ctrl.panel.yBucketSize,
|
||||
};
|
||||
|
||||
setupFunc(ctrl, ctx);
|
||||
|
||||
let logBase = ctrl.panel.yAxis.logBase;
|
||||
let bucketsData;
|
||||
if (ctrl.panel.dataFormat === 'tsbuckets') {
|
||||
bucketsData = histogramToHeatmap(ctx.series);
|
||||
} else {
|
||||
bucketsData = convertToHeatMap(ctx.series, ctx.data.yBucketSize, ctx.data.xBucketSize, logBase);
|
||||
}
|
||||
ctx.data.buckets = bucketsData;
|
||||
|
||||
let { cards, cardStats } = convertToCards(bucketsData);
|
||||
ctx.data.cards = cards;
|
||||
ctx.data.cardStats = cardStats;
|
||||
|
||||
// let elemHtml = `
|
||||
// <div class="heatmap-wrapper">
|
||||
// <div class="heatmap-canvas-wrapper">
|
||||
// <div class="heatmap-panel" style='width:${elementWidth}px'></div>
|
||||
// </div>
|
||||
// </div>`;
|
||||
|
||||
// var element = $.parseHTML(elemHtml);
|
||||
// $compile(element)(scope);
|
||||
// scope.$digest();
|
||||
|
||||
ctrl.data = ctx.data;
|
||||
ctx.element = {
|
||||
find: () => ({
|
||||
on: () => {},
|
||||
css: () => 189,
|
||||
width: () => 189,
|
||||
height: () => 200,
|
||||
find: () => ({
|
||||
on: () => {},
|
||||
}),
|
||||
}),
|
||||
on: () => {},
|
||||
};
|
||||
render = rendering(scope, ctx.element, [], ctrl);
|
||||
render.render();
|
||||
render.ctrl.renderingCompleted();
|
||||
});
|
||||
};
|
||||
|
||||
func(ctx);
|
||||
});
|
||||
}
|
||||
|
||||
heatmapScenario('default options', function(ctx) {
|
||||
ctx.setup(function(ctrl) {
|
||||
ctrl.panel.yAxis.logBase = 1;
|
||||
});
|
||||
|
||||
it('should draw correct Y axis', function() {
|
||||
console.log('Runnign first test');
|
||||
// console.log(render.ctrl.data);
|
||||
console.log(render.scope.yScale);
|
||||
var yTicks = getTicks(ctx.element, '.axis-y');
|
||||
expect(yTicks).toEqual(['1', '2', '3']);
|
||||
});
|
||||
|
||||
it('should draw correct X axis', function() {
|
||||
var xTicks = getTicks(ctx.element, '.axis-x');
|
||||
let expectedTicks = [
|
||||
formatTime('01 Mar 2017 10:00:00'),
|
||||
formatTime('01 Mar 2017 10:15:00'),
|
||||
formatTime('01 Mar 2017 10:30:00'),
|
||||
formatTime('01 Mar 2017 10:45:00'),
|
||||
formatTime('01 Mar 2017 11:00:00'),
|
||||
];
|
||||
expect(xTicks).toEqual(expectedTicks);
|
||||
});
|
||||
});
|
||||
|
||||
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).toEqual(['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).toEqual(['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).toEqual(['1', '32', '1.0 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).toEqual(['1', '1 K', '1.0 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).toEqual(['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).toEqual(['0 ns', '17 min', '33 min', '50 min', '1.11 hour']);
|
||||
});
|
||||
});
|
||||
|
||||
heatmapScenario('when data format is Time series buckets', function(ctx) {
|
||||
ctx.setup(function(ctrl, ctx) {
|
||||
ctrl.panel.dataFormat = 'tsbuckets';
|
||||
|
||||
const series = [
|
||||
{
|
||||
alias: '1',
|
||||
datapoints: [[1000, 1422774000000], [200000, 1422774060000]],
|
||||
},
|
||||
{
|
||||
alias: '2',
|
||||
datapoints: [[3000, 1422774000000], [400000, 1422774060000]],
|
||||
},
|
||||
{
|
||||
alias: '3',
|
||||
datapoints: [[2000, 1422774000000], [300000, 1422774060000]],
|
||||
},
|
||||
];
|
||||
ctx.series = series.map(s => new TimeSeries(s));
|
||||
|
||||
ctx.data.tsBuckets = series.map(s => s.alias).concat('');
|
||||
ctx.data.yBucketSize = 1;
|
||||
let xBucketBoundSet = series[0].datapoints.map(dp => dp[1]);
|
||||
ctx.data.xBucketSize = calculateBucketSize(xBucketBoundSet);
|
||||
});
|
||||
|
||||
it('should draw correct Y axis', function() {
|
||||
var yTicks = getTicks(ctx.element, '.axis-y');
|
||||
expect(yTicks).toEqual(['1', '2', '3', '']);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function getTicks(element, axisSelector) {
|
||||
// return element
|
||||
// .find(axisSelector)
|
||||
// .find('text')
|
||||
// .map(function() {
|
||||
// return this.textContent;
|
||||
// })
|
||||
// .get();
|
||||
}
|
||||
|
||||
function formatTime(timeStr) {
|
||||
let format = 'HH:mm';
|
||||
return moment.utc(timeStr, 'DD MMM YYYY HH:mm:ss').format(format);
|
||||
}
|
||||
@ -1,320 +0,0 @@
|
||||
import { describe, beforeEach, it, sinon, expect, angularMocks } from '../../../../../test/lib/common';
|
||||
|
||||
import '../module';
|
||||
import angular from 'angular';
|
||||
import $ from 'jquery';
|
||||
import helpers from 'test/specs/helpers';
|
||||
import TimeSeries from 'app/core/time_series2';
|
||||
import moment from 'moment';
|
||||
import { Emitter } from 'app/core/core';
|
||||
import rendering from '../rendering';
|
||||
import { convertToHeatMap, convertToCards, histogramToHeatmap, calculateBucketSize } from '../heatmap_data_converter';
|
||||
|
||||
describe('grafanaHeatmap', function() {
|
||||
beforeEach(angularMocks.module('grafana.core'));
|
||||
|
||||
function heatmapScenario(desc, func, elementWidth = 500) {
|
||||
describe(desc, function() {
|
||||
var ctx: any = {};
|
||||
|
||||
ctx.setup = function(setupFunc) {
|
||||
beforeEach(
|
||||
angularMocks.module(function($provide) {
|
||||
$provide.value('timeSrv', new helpers.TimeSrvStub());
|
||||
})
|
||||
);
|
||||
|
||||
beforeEach(
|
||||
angularMocks.inject(function($rootScope, $compile) {
|
||||
var ctrl: any = {
|
||||
colorSchemes: [
|
||||
{
|
||||
name: 'Oranges',
|
||||
value: 'interpolateOranges',
|
||||
invert: 'dark',
|
||||
},
|
||||
{ name: 'Reds', value: 'interpolateReds', invert: 'dark' },
|
||||
],
|
||||
events: new Emitter(),
|
||||
height: 200,
|
||||
panel: {
|
||||
heatmap: {},
|
||||
cards: {
|
||||
cardPadding: null,
|
||||
cardRound: null,
|
||||
},
|
||||
color: {
|
||||
mode: 'spectrum',
|
||||
cardColor: '#b4ff00',
|
||||
colorScale: 'linear',
|
||||
exponent: 0.5,
|
||||
colorScheme: 'interpolateOranges',
|
||||
fillBackground: false,
|
||||
},
|
||||
legend: {
|
||||
show: false,
|
||||
},
|
||||
xBucketSize: 1000,
|
||||
xBucketNumber: null,
|
||||
yBucketSize: 1,
|
||||
yBucketNumber: null,
|
||||
xAxis: {
|
||||
show: true,
|
||||
},
|
||||
yAxis: {
|
||||
show: true,
|
||||
format: 'short',
|
||||
decimals: null,
|
||||
logBase: 1,
|
||||
splitFactor: null,
|
||||
min: null,
|
||||
max: null,
|
||||
removeZeroValues: false,
|
||||
},
|
||||
tooltip: {
|
||||
show: true,
|
||||
seriesStat: false,
|
||||
showHistogram: false,
|
||||
},
|
||||
highlightCards: true,
|
||||
},
|
||||
renderingCompleted: sinon.spy(),
|
||||
hiddenSeries: {},
|
||||
dashboard: {
|
||||
getTimezone: sinon.stub().returns('utc'),
|
||||
},
|
||||
range: {
|
||||
from: moment.utc('01 Mar 2017 10:00:00', 'DD MMM YYYY HH:mm:ss'),
|
||||
to: moment.utc('01 Mar 2017 11:00:00', 'DD MMM YYYY HH:mm:ss'),
|
||||
},
|
||||
};
|
||||
|
||||
var scope = $rootScope.$new();
|
||||
scope.ctrl = ctrl;
|
||||
|
||||
ctx.series = [];
|
||||
ctx.series.push(
|
||||
new TimeSeries({
|
||||
datapoints: [[1, 1422774000000], [2, 1422774060000]],
|
||||
alias: 'series1',
|
||||
})
|
||||
);
|
||||
ctx.series.push(
|
||||
new TimeSeries({
|
||||
datapoints: [[2, 1422774000000], [3, 1422774060000]],
|
||||
alias: 'series2',
|
||||
})
|
||||
);
|
||||
|
||||
ctx.data = {
|
||||
heatmapStats: {
|
||||
min: 1,
|
||||
max: 3,
|
||||
minLog: 1,
|
||||
},
|
||||
xBucketSize: ctrl.panel.xBucketSize,
|
||||
yBucketSize: ctrl.panel.yBucketSize,
|
||||
};
|
||||
|
||||
setupFunc(ctrl, ctx);
|
||||
|
||||
let logBase = ctrl.panel.yAxis.logBase;
|
||||
let bucketsData;
|
||||
if (ctrl.panel.dataFormat === 'tsbuckets') {
|
||||
bucketsData = histogramToHeatmap(ctx.series);
|
||||
} else {
|
||||
bucketsData = convertToHeatMap(ctx.series, ctx.data.yBucketSize, ctx.data.xBucketSize, logBase);
|
||||
}
|
||||
ctx.data.buckets = bucketsData;
|
||||
|
||||
let { cards, cardStats } = convertToCards(bucketsData);
|
||||
ctx.data.cards = cards;
|
||||
ctx.data.cardStats = cardStats;
|
||||
|
||||
let elemHtml = `
|
||||
<div class="heatmap-wrapper">
|
||||
<div class="heatmap-canvas-wrapper">
|
||||
<div class="heatmap-panel" style='width:${elementWidth}px'></div>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
var element = angular.element(elemHtml);
|
||||
$compile(element)(scope);
|
||||
scope.$digest();
|
||||
|
||||
ctrl.data = ctx.data;
|
||||
ctx.element = element;
|
||||
rendering(scope, $(element), [], ctrl);
|
||||
ctrl.events.emit('render');
|
||||
})
|
||||
);
|
||||
};
|
||||
|
||||
func(ctx);
|
||||
});
|
||||
}
|
||||
|
||||
heatmapScenario('default options', function(ctx) {
|
||||
ctx.setup(function(ctrl) {
|
||||
ctrl.panel.yAxis.logBase = 1;
|
||||
});
|
||||
|
||||
it('should draw correct Y axis', function() {
|
||||
var yTicks = getTicks(ctx.element, '.axis-y');
|
||||
expect(yTicks).to.eql(['1', '2', '3']);
|
||||
});
|
||||
|
||||
it('should draw correct X axis', function() {
|
||||
var xTicks = getTicks(ctx.element, '.axis-x');
|
||||
let expectedTicks = [
|
||||
formatTime('01 Mar 2017 10:00:00'),
|
||||
formatTime('01 Mar 2017 10:15:00'),
|
||||
formatTime('01 Mar 2017 10:30:00'),
|
||||
formatTime('01 Mar 2017 10:45:00'),
|
||||
formatTime('01 Mar 2017 11:00:00'),
|
||||
];
|
||||
expect(xTicks).to.eql(expectedTicks);
|
||||
});
|
||||
});
|
||||
|
||||
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.0 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.0 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.11 hour']);
|
||||
});
|
||||
});
|
||||
|
||||
heatmapScenario('when data format is Time series buckets', function(ctx) {
|
||||
ctx.setup(function(ctrl, ctx) {
|
||||
ctrl.panel.dataFormat = 'tsbuckets';
|
||||
|
||||
const series = [
|
||||
{
|
||||
alias: '1',
|
||||
datapoints: [[1000, 1422774000000], [200000, 1422774060000]],
|
||||
},
|
||||
{
|
||||
alias: '2',
|
||||
datapoints: [[3000, 1422774000000], [400000, 1422774060000]],
|
||||
},
|
||||
{
|
||||
alias: '3',
|
||||
datapoints: [[2000, 1422774000000], [300000, 1422774060000]],
|
||||
},
|
||||
];
|
||||
ctx.series = series.map(s => new TimeSeries(s));
|
||||
|
||||
ctx.data.tsBuckets = series.map(s => s.alias).concat('');
|
||||
ctx.data.yBucketSize = 1;
|
||||
let xBucketBoundSet = series[0].datapoints.map(dp => dp[1]);
|
||||
ctx.data.xBucketSize = calculateBucketSize(xBucketBoundSet);
|
||||
});
|
||||
|
||||
it('should draw correct Y axis', function() {
|
||||
var yTicks = getTicks(ctx.element, '.axis-y');
|
||||
expect(yTicks).to.eql(['1', '2', '3', '']);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function getTicks(element, axisSelector) {
|
||||
return element
|
||||
.find(axisSelector)
|
||||
.find('text')
|
||||
.map(function() {
|
||||
return this.textContent;
|
||||
})
|
||||
.get();
|
||||
}
|
||||
|
||||
function formatTime(timeStr) {
|
||||
let format = 'HH:mm';
|
||||
return moment.utc(timeStr, 'DD MMM YYYY HH:mm:ss').format(format);
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user