IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Gauge: tweaks to background color and height usage (#17019)

Browse Source
This commit is contained in:
Torkel Ödegaard 2019-05-13 13:18:14 +02:00 committed by GitHub
parent db95414d02
commit 597c380ead
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/grafana-ui/src/components/Gauge/Gauge.tsx
View File

@ -69,14 +69,14 @@ export class Gauge extends PureComponent<Props> {
const backgroundColor = selectThemeVariant( const backgroundColor = selectThemeVariant(
{ {
dark: theme.colors.dark3, dark: theme.colors.dark8,
light: '#e6e6e6', light: theme.colors.gray6,
}, },
theme.type theme.type
); );
const gaugeWidthReduceRatio = showThresholdLabels ? 1.5 : 1; const gaugeWidthReduceRatio = showThresholdLabels ? 1.5 : 1;
const gaugeWidth = Math.min(dimension / 6, 40) / gaugeWidthReduceRatio; const gaugeWidth = Math.min(dimension / 5, 40) / gaugeWidthReduceRatio;
const thresholdMarkersWidth = gaugeWidth / 5; const thresholdMarkersWidth = gaugeWidth / 5;
const fontSize = Math.min(dimension / 5.5, 100) * (value.text !== null ? this.getFontScale(value.text.length) : 1); const fontSize = Math.min(dimension / 5.5, 100) * (value.text !== null ? this.getFontScale(value.text.length) : 1);
const thresholdLabelFontSize = fontSize / 2.5; const thresholdLabelFontSize = fontSize / 2.5;
@ -181,7 +181,7 @@ function calculateGaugeAutoProps(width: number, height: number, title: string |
const titleFontSize = Math.min((width * 0.15) / 1.5, 20); // 20% of height * line-height, max 40px const titleFontSize = Math.min((width * 0.15) / 1.5, 20); // 20% of height * line-height, max 40px
const titleHeight = titleFontSize * 1.5; const titleHeight = titleFontSize * 1.5;
const availableHeight = showLabel ? height - titleHeight : height; const availableHeight = showLabel ? height - titleHeight : height;
const gaugeHeight = Math.min(availableHeight * 0.7, width); const gaugeHeight = Math.min(availableHeight, width);
return { return {
showLabel, showLabel,