Hacktoberfest 2026: as issues que os mantenedores marcaram para outubro, abertas e boas para iniciantes. Ver issues do Hacktoberfest

LineChart data point popup/tooltip is truncated at 320px viewport width

Fechada
  • Algo errado?
#8,972 0 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 1 dia

Ninguém assumiu esta issue ainda.

Avaliação

Dificuldade
3/5
Tempo estimado
1-2 dias
Facilidade para iniciantes
68/100
Tipo de issue
Bug
Clareza
Razoavelmente clara
Status de atividade
Ativa
Stack de tecnologia
react, typescript
Domínio
frontend

Direção de pesquisa

Start by reproducing the LineChart interaction at a 320px viewport in Chrome, then trace the chart popup or tooltip positioning and clipping behavior. Verify the result by clicking data points near different edges and confirming that the complete data popup remains visible without being cut off.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

a11y Charts
Describe the bug

When a user clicks on a data point in a LineChart at 320px viewport width, a popup/tooltip appears showing the relevant data. However, this popup is being truncated/clipped by the component — the popup content is cut off and not fully visible.

This is a separate issue from #8407 (chart axis truncation at 320px, which has been clarified as acceptable). The popup truncation is a blocker because users cannot read the data values when interacting with the chart on narrow viewports.

Isolated Example

No response

Reproduction steps
  1. Render a LineChart with multiple data points
  2. Use browser DevTools to set viewport to 320px width
  3. Click on any data point in the chart
  4. Observe that the popup/tooltip showing the data is truncated/clipped
Expected Behaviour

When a user clicks a data point, the popup must be fully visible and not clipped by the component boundary or viewport edge, even at 320px viewport width.

Screenshots or Videos
Image
UI5 Web Components for React Version

2.26.0

UI5 Web Components Version

2.26.0

Browser

Chrome

Operating System

No response

Additional Context

No response

Relevant log output
Organization

No response

Declaration
  • I’m not disclosing any internal or sensitive information.
Linguagem predominante
TypeScript
Estrelas
541
Forks
114
Merge médio
21h 40min
PRs com merge (30d)
87

Preparar o ambiente

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de UI5/webcomponents-react

Todas as issues de UI5/webcomponents-react

Issues semelhantes

Mais issues de TypeScript

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.