From 8ff997594f566cb6a4582b96dd9cba0b3e4b7028 Mon Sep 17 00:00:00 2001 From: bergquist Date: Fri, 5 Feb 2016 10:03:08 +0100 Subject: [PATCH] fix(tablepanel): change to using two thresholds fixes #3878 --- docs/sources/reference/table_panel.md | 8 ++++---- public/app/features/dashboard/dashboardSrv.js | 18 +++++++++++++++++- public/app/plugins/panel/table/editor.html | 2 +- public/app/plugins/panel/table/renderer.ts | 6 +++--- .../panel/table/specs/renderer_specs.ts | 12 +++++++++++- public/test/specs/dashboardSrv-specs.js | 15 ++++++++++++++- 6 files changed, 50 insertions(+), 11 deletions(-) diff --git a/docs/sources/reference/table_panel.md b/docs/sources/reference/table_panel.md index 65437f85bd7..a857be38357 100644 --- a/docs/sources/reference/table_panel.md +++ b/docs/sources/reference/table_panel.md @@ -17,7 +17,7 @@ To view table panels in action and test different configurations with sample dat The table panel has many ways to manipulate your data for optimal presentation. - + 1. `Data`: Control how your query is transformed into a table. 2. `Table Display`: Table display options. @@ -33,19 +33,19 @@ you want in the table. Only applicable for some transforms. ### Time series to rows - + In the most simple mode you can turn time series to rows. This means you get a `Time`, `Metric` and a `Value` column. Where `Metric` is the name of the time series. ### Time series to columns -![](/img/v2/table_ts_to_columns.png) +![](/img/v2/table_ts_to_columns2.png) This transform allows you to take multiple time series and group them by time. Which will result in the primary column being `Time` and a column for each time series. ### Time series aggregations -![](/img/v2/table_ts_to_aggregations.png) +![](/img/v2/table_ts_to_aggregations2.png) This table transformation will lay out your table into rows by metric, allowing columns of `Avg`, `Min`, `Max`, `Total`, `Current` and `Count`. More than one column can be added. ### Annotations diff --git a/public/app/features/dashboard/dashboardSrv.js b/public/app/features/dashboard/dashboardSrv.js index 2f64fec9be1..be404dd1ce1 100644 --- a/public/app/features/dashboard/dashboardSrv.js +++ b/public/app/features/dashboard/dashboardSrv.js @@ -208,7 +208,7 @@ function (angular, $, _, moment) { var i, j, k; var oldVersion = this.schemaVersion; var panelUpgrades = []; - this.schemaVersion = 9; + this.schemaVersion = 10; if (oldVersion === this.schemaVersion) { return; @@ -381,6 +381,22 @@ function (angular, $, _, moment) { }); } + // schema version 10 changes + if (oldVersion < 10) { + // move aliasYAxis changes + panelUpgrades.push(function(panel) { + if (panel.type !== 'table') { return; } + + _.each(panel.styles, function(style) { + if (style.thresholds && style.thresholds.length >= 3) { + var k = style.thresholds; + k.shift(); + style.thresholds = k; + } + }); + }); + } + if (panelUpgrades.length === 0) { return; } diff --git a/public/app/plugins/panel/table/editor.html b/public/app/plugins/panel/table/editor.html index 010c30326d9..c9e0bad5d9a 100644 --- a/public/app/plugins/panel/table/editor.html +++ b/public/app/plugins/panel/table/editor.html @@ -122,7 +122,7 @@ ThresholdsComma seperated values
  • - +
  • Colors diff --git a/public/app/plugins/panel/table/renderer.ts b/public/app/plugins/panel/table/renderer.ts index be73af06e64..755c7262070 100644 --- a/public/app/plugins/panel/table/renderer.ts +++ b/public/app/plugins/panel/table/renderer.ts @@ -16,12 +16,12 @@ export class TableRenderer { getColorForValue(value, style) { if (!style.thresholds) { return null; } - for (var i = style.thresholds.length - 1; i >= 0 ; i--) { - if (value >= style.thresholds[i]) { + for (var i = style.thresholds.length; i > 0; i--) { + if (value >= style.thresholds[i - 1]) { return style.colors[i]; } } - return null; + return _.first(style.colors); } defaultCellFormater(v) { diff --git a/public/app/plugins/panel/table/specs/renderer_specs.ts b/public/app/plugins/panel/table/specs/renderer_specs.ts index 7d7d7b38661..8f551b5cb1d 100644 --- a/public/app/plugins/panel/table/specs/renderer_specs.ts +++ b/public/app/plugins/panel/table/specs/renderer_specs.ts @@ -33,7 +33,7 @@ describe('when rendering table', () => { unit: 'none', decimals: 1, colorMode: 'value', - thresholds: [0, 50, 80], + thresholds: [50, 80], colors: ['green', 'orange', 'red'] } ] @@ -56,11 +56,21 @@ describe('when rendering table', () => { expect(html).to.be('asd'); }); + it('colored cell should have style', () => { + var html = renderer.renderCell(2, 40); + expect(html).to.be('40.0'); + }); + it('colored cell should have style', () => { var html = renderer.renderCell(2, 55); expect(html).to.be('55.0'); }); + it('colored cell should have style', () => { + var html = renderer.renderCell(2, 85); + expect(html).to.be('85.0'); + }); + it('unformated undefined should be rendered as -', () => { var html = renderer.renderCell(3, undefined); expect(html).to.be(''); diff --git a/public/test/specs/dashboardSrv-specs.js b/public/test/specs/dashboardSrv-specs.js index 475178fa94d..e2bbdaf4ac3 100644 --- a/public/test/specs/dashboardSrv-specs.js +++ b/public/test/specs/dashboardSrv-specs.js @@ -109,6 +109,7 @@ define([ var model; var graph; var singlestat; + var table; beforeEach(function() { model = _dashboardSrv.create({ @@ -127,6 +128,10 @@ define([ { type: 'singlestat', legend: true, thresholds: '10,20,30', aliasYAxis: { test: 2 }, grid: { min: 1, max: 10 }, targets: [{refId: 'A'}, {}], + }, + { + type: 'table', legend: true, styles: [{ thresholds: ["10", "20", "30"]}, { thresholds: ["100", "200", "300"]}], + targets: [{refId: 'A'}, {}], } ] } @@ -135,6 +140,7 @@ define([ graph = model.rows[0].panels[0]; singlestat = model.rows[0].panels[1]; + table = model.rows[0].panels[2]; }); it('should have title', function() { @@ -180,8 +186,15 @@ define([ expect(model.annotations.list[0].name).to.be('old'); }); + it('table panel should only have two thresholds values', function() { + expect(table.styles[0].thresholds[0]).to.be("20"); + expect(table.styles[0].thresholds[1]).to.be("30"); + expect(table.styles[1].thresholds[0]).to.be("200"); + expect(table.styles[1].thresholds[1]).to.be("300"); + }); + it('dashboard schema version should be set to latest', function() { - expect(model.schemaVersion).to.be(9); + expect(model.schemaVersion).to.be(10); }); });