Skip to content

[Bug]: Tooltip value is cut off at the bottom in HorizontalBarChartWithAxis #36554

Description

@payal133

Charting Control

Other...

Package version

9.3.23

React version

18.3.1

Environment

System:
    OS: Linux 6.8 Debian GNU/Linux 13 (trixie) 13 (trixie)
    CPU: (32) x64 AMD EPYC 7763 64-Core Processor
    Memory: 115.44 GB / 125.79 GB
    Container: Yes
    Shell: 5.2.37 - /bin/bash

Current Behavior

When you hover over a bar, the tooltip appears and the large value inside it is
cut off along the bottom. The bottom edge of the text is sliced off, so the number
looks incomplete.

Also reproduces directly on the official Fluent Storybook: https://storybooks.fluentui.dev/charts/iframe.html?viewMode=story&id=charts-horizontalbarchartwithaxis--horizontal-bar-with-axis-basic

Expected Behavior

The value in the tooltip should be fully visible, with nothing cut off.

Reproduction

https://stackblitz.com/edit/lkkc9x2j?file=index.html,src%2Fexample.tsx,src%2Findex.tsx

Steps to reproduce

  1. Open the StackBlitz repro
  2. Hover over any bar in the chart
  3. Look at the large value in the tooltip — the bottom of the text is cut off

This also happens on the official Fluent Storybook:
https://storybooks.fluentui.dev/charts/iframe.html?viewMode=story&id=charts-horizontalbarchartwithaxis--horizontal-bar-with-axis-basic
Hover any bar and the "37%" value is cut along the bottom.

Are you reporting an Accessibility issue?

None

Suggested severity

Urgent - No workaround and Products/sites are affected

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • The provided reproduction is a minimal reproducible example of the bug.

Metadata

Metadata

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions