From e16c902dd5c73ae130a0b472f88e7d5fda5b9e0f Mon Sep 17 00:00:00 2001 From: Marco Vettorello Date: Thu, 24 Oct 2024 08:52:36 +0200 Subject: [PATCH] fix(xy): single point visibility (#2557) * fix(xy): single point visibility * test(vrt): update screenshots [skip ci] --------- Co-authored-by: elastic-datavis[bot] <98618603+elastic-datavis[bot]@users.noreply.github.com> --- .../test-single-point-chrome-linux.png | Bin 0 -> 22686 bytes .../xy_chart/renderer/canvas/areas.ts | 3 +- .../xy_chart/renderer/canvas/lines.ts | 3 +- .../area/22_single_point_test.story.tsx | 97 ++++++++++++++++++ storybook/stories/area/area.stories.tsx | 1 + 5 files changed, 102 insertions(+), 2 deletions(-) create mode 100644 e2e/screenshots/all.test.ts-snapshots/baselines/area-chart/test-single-point-chrome-linux.png create mode 100644 storybook/stories/area/22_single_point_test.story.tsx diff --git a/e2e/screenshots/all.test.ts-snapshots/baselines/area-chart/test-single-point-chrome-linux.png b/e2e/screenshots/all.test.ts-snapshots/baselines/area-chart/test-single-point-chrome-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..400cb39c6367ac251e80504b0810288d2c289d65 GIT binary patch literal 22686 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

dAYwk1YnAm!hgnnLAx&BXmS+pSjRXJq8OFMe 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 literal 0 HcmV?d00001 diff --git a/packages/charts/src/chart_types/xy_chart/renderer/canvas/areas.ts b/packages/charts/src/chart_types/xy_chart/renderer/canvas/areas.ts index 3009e46092..ba1a352530 100644 --- a/packages/charts/src/chart_types/xy_chart/renderer/canvas/areas.ts +++ b/packages/charts/src/chart_types/xy_chart/renderer/canvas/areas.ts @@ -75,7 +75,8 @@ export function renderAreas( style.line.strokeWidth, minPointDistance, style.pointVisibilityMinDistance, - hasFit, + // has a connecting line only if is fit and there are more than one point on the chart + hasFit && points.length > 1, ), { area: getPanelClipping(panel, rotation), shouldClip: points[0]?.value.mark !== null }, ); diff --git a/packages/charts/src/chart_types/xy_chart/renderer/canvas/lines.ts b/packages/charts/src/chart_types/xy_chart/renderer/canvas/lines.ts index c97e9ff135..c997f102d0 100644 --- a/packages/charts/src/chart_types/xy_chart/renderer/canvas/lines.ts +++ b/packages/charts/src/chart_types/xy_chart/renderer/canvas/lines.ts @@ -60,7 +60,8 @@ export function renderLines( line.style.line.strokeWidth, line.minPointDistance, line.style.pointVisibilityMinDistance, - line.hasFit, + // has a connecting line only if is fit and there are more than one point on the chart + line.hasFit && line.points.length > 1, ), // TODO: add padding over clipping { area: clippings, shouldClip: line.points[0]?.value.mark !== null }, diff --git a/storybook/stories/area/22_single_point_test.story.tsx b/storybook/stories/area/22_single_point_test.story.tsx new file mode 100644 index 0000000000..5667237a59 --- /dev/null +++ b/storybook/stories/area/22_single_point_test.story.tsx @@ -0,0 +1,97 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0 and the Server Side Public License, v 1; you may not use this file except + * in compliance with, at your election, the Elastic License 2.0 or the Server + * Side Public License, v 1. + */ + +import React from 'react'; + +import { + AreaSeries, + Axis, + Chart, + Position, + ScaleType, + Settings, + timeFormatter, + LegendValue, + LineSeries, +} from '@elastic/charts'; +import { KIBANA_METRICS } from '@elastic/charts/src/utils/data_samples/test_dataset_kibana'; + +import { ChartsStory } from '../../types'; +import { useBaseTheme } from '../../use_base_theme'; + +const dateFormatter = timeFormatter('HH:mm'); +const dataLow = KIBANA_METRICS.metrics.kibana_os_load.v1.data; + +export const Example: ChartsStory = (_, { title, description }) => ( + + + + Number(d).toFixed(2)} + /> + + + + + + +); diff --git a/storybook/stories/area/area.stories.tsx b/storybook/stories/area/area.stories.tsx index 50646bcbc8..b1bb03722a 100644 --- a/storybook/stories/area/area.stories.tsx +++ b/storybook/stories/area/area.stories.tsx @@ -32,3 +32,4 @@ export { Example as steppedArea } from './20_stepped_area.story'; export { Example as testLinear } from './11_test_linear.story'; export { Example as testTime } from './12_test_time.story'; export { Example as testStackedWithMissingValues } from './16_test_stacked_with_missing.story'; +export { Example as testSinglePoint } from './22_single_point_test.story';