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

magic number solution

Browse Source
This commit is contained in:
Peter Holmberg 2019-01-29 10:35:42 +01:00
parent 142ebc7546
commit 4b0df606d5
2 changed files with 7 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -116,7 +116,7 @@ describe('Format value', () => {
const result = instance.formatValue(value); const result = instance.formatValue(value);
expect(result).toEqual(' 6.0 '); expect(result).toEqual('6.0');
}); });
it('should return formatted value if there are no matching value mappings', () => { it('should return formatted value if there are no matching value mappings', () => {
@ -129,7 +129,7 @@ describe('Format value', () => {
const result = instance.formatValue(value); const result = instance.formatValue(value);
expect(result).toEqual(' 10.0 '); expect(result).toEqual('10.0');
}); });
it('should return mapped value if there are matching value mappings', () => { it('should return mapped value if there are matching value mappings', () => {
@ -142,6 +142,6 @@ describe('Format value', () => {
const result = instance.formatValue(value); const result = instance.formatValue(value);
expect(result).toEqual(' 1-20 '); expect(result).toEqual('1-20');
}); });
}); });

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

@ -61,7 +61,7 @@ export class Gauge extends PureComponent<Props> {
if (valueMappings.length > 0) { if (valueMappings.length > 0) {
const valueMappedValue = getMappedValue(valueMappings, value); const valueMappedValue = getMappedValue(valueMappings, value);
if (valueMappedValue) { if (valueMappedValue) {
return `${prefix} ${valueMappedValue.text} ${suffix}`; return `${prefix && prefix + ' '}${valueMappedValue.text}${suffix && ' ' + suffix}`;
} }
} }
@ -147,9 +147,8 @@ export class Gauge extends PureComponent<Props> {
const gaugeWidthReduceRatio = showThresholdLabels ? 1.5 : 1; const gaugeWidthReduceRatio = showThresholdLabels ? 1.5 : 1;
const gaugeWidth = Math.min(dimension / 6, 60) / gaugeWidthReduceRatio; const gaugeWidth = Math.min(dimension / 6, 60) / gaugeWidthReduceRatio;
const thresholdMarkersWidth = gaugeWidth / 5; const thresholdMarkersWidth = gaugeWidth / 5;
const fontSize = Math.ceil( const fontSize =
Math.min(dimension / 5, 100) * (formattedValue !== null ? this.getFontScale(formattedValue.length) : 1) Math.min(dimension / 5, 100) * (formattedValue !== null ? this.getFontScale(formattedValue.length) : 1);
);
const thresholdLabelFontSize = fontSize / 2.5; const thresholdLabelFontSize = fontSize / 2.5;
const options = { const options = {
@ -180,7 +179,7 @@ export class Gauge extends PureComponent<Props> {
value: { value: {
color: this.getFontColor(value), color: this.getFontColor(value),
formatter: () => { formatter: () => {
return this.formatValue(value); return formattedValue;
}, },
font: { size: fontSize, family: '"Helvetica Neue", Helvetica, Arial, sans-serif' }, font: { size: fontSize, family: '"Helvetica Neue", Helvetica, Arial, sans-serif' },
}, },