TablePanel: Add solid background cell display mode (#32446)

* Add solid color background cell display mode

* Update docs/sources/panels/visualizations/table/table-field-options.md

Co-authored-by: achatterjee-grafana <70489351+achatterjee-grafana@users.noreply.github.com>

* Update docs/sources/panels/visualizations/table/table-field-options.md

Co-authored-by: achatterjee-grafana <70489351+achatterjee-grafana@users.noreply.github.com>
This commit is contained in:
Dominik Prokop
2021-04-02 13:49:12 +02:00
committed by GitHub
parent fddc83ec7c
commit 27398625ca
4 changed files with 11 additions and 3 deletions

View File

@@ -35,6 +35,12 @@ function getCellStyle(tableStyles: TableStyles, field: Field, displayValue: Disp
return tableStyles.buildCellContainerStyle(displayValue.color);
}
if (field.config.custom?.displayMode === TableCellDisplayMode.ColorBackgroundSolid) {
const bgColor = tinycolor(displayValue.color);
const textColor = getTextColorForBackground(displayValue.color!);
return tableStyles.buildCellContainerStyle(textColor, bgColor.toRgbString());
}
if (field.config.custom?.displayMode === TableCellDisplayMode.ColorBackground) {
const themeFactor = tableStyles.theme.isDark ? 1 : -0.7;
const bgColor2 = tinycolor(displayValue.color)

View File

@@ -14,6 +14,7 @@ export enum TableCellDisplayMode {
Auto = 'auto',
ColorText = 'color-text',
ColorBackground = 'color-background',
ColorBackgroundSolid = 'color-background-solid',
GradientGauge = 'gradient-gauge',
LcdGauge = 'lcd-gauge',
JSONView = 'json-view',