github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Metrics UI] remove middle number in legend and adjust calculation of max number (#89020) (#89893)

Browse source 
* get midpoint of max and min instead of half of max number

* remove middle tick from stepped gradient legend

* use value instead of max values to calculate bounds

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Sandra Gonzales 2021-02-01 14:21:12 -05:00 • committed by GitHub
parent 7e19db9631
commit f687709ac4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 10 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

5
x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/stepped_gradient_legend.tsx
View file

@ -16,13 +16,12 @@ interface Props {
bounds: InfraWaffleMapBounds;
formatter: InfraFormatter;
}
type TickValue = 0 | 1;
export const SteppedGradientLegend: React.FC<Props> = ({ legend, bounds, formatter }) => {
return (
<LegendContainer>
<Ticks>
<TickLabel value={0} bounds={bounds} formatter={formatter} />
<TickLabel value={0.5} bounds={bounds} formatter={formatter} />
<TickLabel value={1} bounds={bounds} formatter={formatter} />
</Ticks>
<GradientContainer>
@ -39,7 +38,7 @@ export const SteppedGradientLegend: React.FC<Props> = ({ legend, bounds, formatt
interface TickProps {
bounds: InfraWaffleMapBounds;
value: number;
value: TickValue;
formatter: InfraFormatter;
}

4
x-pack/plugins/infra/public/pages/metrics/inventory_view/lib/calculate_bounds_from_nodes.test.ts
View file

@ -37,14 +37,14 @@ describe('calculateBoundsFromNodes', () => {
const bounds = calculateBoundsFromNodes(nodes);
expect(bounds).toEqual({
min: 0.2,
max: 1.5,
max: 0.5,
});
});
it('should have a minimum of 0 for only a single node', () => {
const bounds = calculateBoundsFromNodes([nodes[0]]);
expect(bounds).toEqual({
min: 0,
max: 1.5,
max: 0.5,
});
});
it('should return zero for empty nodes', () => {

18
x-pack/plugins/infra/public/pages/metrics/inventory_view/lib/calculate_bounds_from_nodes.ts
View file

@ -9,23 +9,17 @@ import { SnapshotNode } from '../../../../../common/http_api/snapshot_api';
import { InfraWaffleMapBounds } from '../../../../lib/lib';
export const calculateBoundsFromNodes = (nodes: SnapshotNode[]): InfraWaffleMapBounds => {
const maxValues = nodes.map((node) => {
const values = nodes.map((node) => {
const metric = first(node.metrics);
if (!metric) return 0;
return metric.max;
});
const minValues = nodes.map((node) => {
const metric = first(node.metrics);
if (!metric) return 0;
return metric.value;
return !metric || !metric.value ? 0 : metric.value;
});
// if there is only one value then we need to set the bottom range to zero for min
// otherwise the legend will look silly since both values are the same for top and
// bottom.
if (minValues.length === 1) {
minValues.unshift(0);
if (values.length === 1) {
values.unshift(0);
}
const maxValue = max(maxValues) || 0;
const minValue = min(minValues) || 0;
const maxValue = max(values) || 0;
const minValue = min(values) || 0;
return { min: isFinite(minValue) ? minValue : 0, max: isFinite(maxValue) ? maxValue : 0 };
};