如何在Plotly Dash表中隐藏滚动条

Question

我有一个包含大量行的表，我想显示我的应用程序中的所有内容

默认情况下，dash_table.DataTable在表太长时添加滚动条。我想删除那个滚动条

Answer 1

假设您有以下应用程序，其中高度设置为300px，溢出是自动的：

import dash
import dash_table
import dash_html_components as html
import pandas as pd

df = pd.read_csv(
    "https://raw.githubusercontent.com/plotly/datasets/master/1962_2006_walmart_store_openings.csv"
)

app = dash.Dash(__name__)

table = dash_table.DataTable(
    id="table",
    columns=[{"name": i, "id": i} for i in df.columns],
    data=df.to_dict("records"),
    style_table={"height": "300px", "overflowY": "auto"},
)

app.layout = html.Div([html.H1("Header"), table, html.Button("Click here")])

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

您将获得此结果应用程序：

在您的情况下，您希望隐藏滚动条。您可能想将style_table更改为：

style_table={"height": "300px", "overflowY": "show"}

虽然将显示整个表格，但不幸的是，这意味着按钮将被隐藏，因为表格溢出超过指定高度：

因此，正确的更改是将桌子的高度设置为不受限制：

style_table={"height": None}

按钮将正确显示：

表的高度控制详细记录在Dash Table docs中。它将向您展示使用overflowY的不同方式