【问题标题】:Dash DataTable Header Scrolling IssuesDash DataTable 标题滚动问题
【发布时间】:2021-05-22 16:13:27
【问题描述】:

在 Dash 中,我在多个项目中反复出现问题。每当我尝试将固定标题与滚动结合使用时,都会出现如下所示的错误行为。标题不会保持固定在正确的位置。

这个问题至少出现在 chrome 和 safari 中,所以我认为这不是浏览器问题。这是我的表格代码,感谢任何帮助或指导!

html.Div(
                            id="table-zone",
                            children=[
                                build_graph_title("Summary Data"),
                                html.Div(
                                    id="summary-datatable-container",
                                    className="pretty_container",
                                    children=[
                                        dt.DataTable(
                                            id="summary-datatable",
                                            columns=[
                                                {
                                                    "hideable": True,
                                                    "name": i,
                                                    "id": i,
                                                }
                                                for i in summary_df.columns
                                                # omit the id column
                                                if i != "id"
                                            ],
                                            css=[
                                                {
                                                    "selector": ".previous-page, "
                                                    ".next-page, .first-page, "
                                                    ".last-page, .export, .show-hide",
                                                    "rule": "color: white;",
                                                },
                                                {
                                                    "selector": ".current-page",
                                                    "rule": "padding-right: 5px;",
                                                },
                                            ],
                                            fixed_rows={
                                                "headers": True,
                                            },
                                            style_cell={
                                                "whiteSpace": "normal",
                                                "height": "auto",
                                                "minWidth": "110px",
                                                "width": "110px",
                                                "maxWidth": "110px",
                                                "textAlign": "center",
                                            },
                                            style_data_conditional=[
                                                {
                                                    "if": {"row_index": "odd"},
                                                    "backgroundColor": "rgb(242, 239, 233)",
                                                },
                                            ],
                                            style_header={
                                                "backgroundColor": "rgb(25, 36, 68)",
                                                "fontWeight": "bold",
                                                "color": "white",
                                                # "textAlign": "center",
                                            },
                                            style_table={
                                                # "height": 320,
                                                "overflowX": "auto",
                                                "overflowY": "auto",
                                            },
                                            data=summary_df.to_dict("records"),
                                            row_selectable="single",
                                            sort_action="native",
                                            filter_action="native",
                                            export_format="csv",
                                            cell_selectable=False,
                                            style_as_list_view=True,
                                            page_size=20,
                                        ),

【问题讨论】:

    标签: python css dashboard plotly-dash


    【解决方案1】:

    这似乎是一个错误。将 dash 从 1.13.3 升级到 1.19 并将 dash-table 从 4.8.1 升级到 4.11.2 解决了这个问题。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-04-11
      • 2021-01-26
      • 1970-01-01
      • 2021-09-01
      • 2015-02-24
      • 1970-01-01
      • 2020-10-15
      • 2013-12-26
      相关资源
      最近更新 更多