plotly / plotly/dash

[BUG] dash_table.DataTable styling issues for header height and column width when using fixed_columns

Aperta
#3,337 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

bug P3
Lingua principale
Python
Stelle
24.4k
Fork
2.3k
Merge medio
2g 7h
PR unite (30g)
13

Descrizione

Context
  • dash: 3.0.4
  • OS: Windows
  • Browser: Firefox 139.0.4
Bug description

I have data where the column name is longer than the data itself. When putting the column as fixed_column in a DataTable, the width of the displayed column seems to be calculated disregarding the length of the column name.

Image

from dash import Dash, dash_table
import pandas as pd

df = pd.DataFrame(
    {
        "longer header": ["aaaaaa", "bbbbbb", "cccccc"],
        **{f"column {i}": ["12345", "12345", "12345"] for i in range(1, 10)},
    }
)

app = Dash()
app.layout = dash_table.DataTable(
    data=df.to_dict("records"),
    columns=[{"id": c, "name": c} for c in df.columns],
    fixed_columns={"headers": True, "data": 1},
    style_table={"minWidth": "100%"},
)

if __name__ == "__main__":
    app.run(debug=True)

If I remove the fixed_columns attribute, it works fine:

Image

Additionally, if I add line breaks to the fixed column header, the height of the header is mismatched between the fixed and the non-fixed columns.

Image

from dash import Dash, dash_table
import pandas as pd


df = pd.DataFrame(
    {
        "longer\nheader": ["aaaaaa", "bbbbbb", "cccccc"],
        **{f"column {i}": ["12345", "12345", "12345"] for i in range(1, 10)},
    }
)

app = Dash()
app.layout = dash_table.DataTable(
    data=df.to_dict("records"),
    columns=[{"id": c, "name": c} for c in df.columns],
    fixed_columns={"headers": True, "data": 1},
    style_table={"minWidth": "100%"},
    style_cell={"whiteSpace": "pre-line"},
)

if __name__ == "__main__":
    app.run(debug=True)

Again this is does not occur if the fixed_columns attribute is removed:

Image

Expected behavior

The width of a fixed column in a DataTable is calculated taking into account the column name as well as the data. The height of the header row of the DataTable is calculated taking into account fixed and non-fixed columns.

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Direzione di ricerca

Inizia eseguendo le riproduzioni fornite di Dash e pandas, prima con fixed_columns e poi senza, incluso il caso di intestazione multilinea. Traccia il comportamento di stile e dimensionamento delle colonne bloccate di DataTable; il lavoro è completato quando la larghezza della colonna bloccata include il testo dell’intestazione e le altezze delle intestazioni bloccata e non bloccata corrispondono.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
pandas, python
Ambito
data-visualization, frontend
Tipo di issue
Bug
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
38/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.