elastic/kibana

[ML] Filter icons in anomaly charts rendered out of visible view

Open

#200 778 ouverte le 19 nov. 2024

Voir sur GitHub
 (3 commentaires) (0 réactions) (1 assigné)TypeScript (19 065 stars) (8 021 forks)batch import
:mlFeature:Anomaly Detectionbuggood first issuepapercutv9.5.0

Description

** Items to be completed **

  • ensure values (even long values) are always rendered within the visible area

Kibana version: latest

Describe the bug:

For anomaly charts in the explorer and in dashboard, the filter icons can sometimes be rendered out of the visible area when the field names/values are long.

Expected behavior:

The field names/values should be truncated to ensure the filter icons always show up. A tooltip can be added as a way for users to view the full field name/value.

Screenshots (if relevant):

Guide contributeur

Stack technique
typescriptreact
Domaine
frontend
Type d'issue
bug
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
2
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
1-3 hours
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
blocked
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
clear
Prérequis
ReactCSSKibana plugin development basics
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
35
Direction de recherche
First, locate the anomaly chart component in the Kibana codebase, likely under x pack/plugins/ml/public/application/explorer/ or a similar directory. The issue involves filter icons being cut off when field values are long. Implement CSS text overflow: ellipsis on the field value elements and ensure the filter icons remain visible. Add a title attribute or a tooltip for the full value. Check the existing styling and any related components like the anomaly chart legend. Review comments and any linked PRs for context. Maintain existing theming and accessibility.