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

Question

我 table 有很多行，我想在我的应用程序中显示所有内容。

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

Answer 1

假设您有以下应用程序，其中高度设置为 300 像素并且自动溢出：

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"}

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

所以正确的更改是简单地将 table 的高度设置为无限制：

style_table={"height": None}

按钮将正确显示：

控制 table 的高度在 Dash Table docs 中有详尽的记录。它将向您展示使用 overflowY.

的不同方法

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

How to hide scrollbar in Plotly Dash Table

python

plotly-dash