Рендеринг данных из функции обратного вызова - Dash - PullRequest
Новая
       12

Рендеринг данных из функции обратного вызова - Dash

0 голосов
/ 18 июня 2019

Я создаю панель мониторинга с несколькими вкладками, триггерами каждой вкладки и файлом .py, который отображает различные элементы объектов-графиков.

Например, мои функции обратного вызова возвращают графики, диаграммы, и я хочу вернуть Datatable.

Я могу сделать рендер dataframe для панд с go.Table, как показано в примере, но не с DataTable, который является более новым и предлагает улучшенный пользовательский интерфейс. 

import pandas as pd
import dash
from dash.dependencies import Input, Output, State
import dash_html_components as html
import dash_core_components as dcc
import plotly.plotly as py
from plotly import graph_objs as go
from plotly.graph_objs import *
import dash_table
import flask
from datetime import datetime as dt
from app import app


layout = html.Div([

    html.Div([

        dcc.Dropdown(
                id='select',
                options=[{'label': i, 'value': i} for i in List],
                value='abc',
                placeholder="xyz",
                style={'width': '100%'}

        ), 

    ], style={"width": "15%", "margin-left": "20%", "margin-right": "35%"}), 


    html.Div([

        dash_table.DataTable(

            id='my-table',
            columns=[{"name": i, "id": i} for i in df_lease.columns],

        )
    ])
])


@app.callback(Output('my-table', 'data'),
              [
                  Input("landlord-select", "value")
              ]
             )
def render_table(company, market):

    df_sub1 = df_lease[(df_lease['Landlord'] == company)] 

    df_sub1 = df_sub1[['UnitNo',
                       'Commencement_Date',
                       'Expiration_Date'
                       ]]

    return df_sub1.to_dict(orient='records')

Ожидаемое поведение - рендерить кадр данных панд как DataTable.

Структура файла: 

- app.py
- index.py
- apps
   |-- __init__.py
   |-- app1.py
   |-- app2.py

index.py включает в себя весь код, который отображает многостраничный макет / вкладку, а свойство children dcc.Tabs обновляется при передаче объекта макета из файла шаблона (app1.py). Вот откуда, я полагаю, ошибка генерируется. 

app.layout = html.Div([

    # tabs
    html.Div([

        dcc.Tabs(
            id="tabs",
            style={"height":"60","verticalAlign":"middle"},
            children=[
                 dcc.Tab(label="Marketing", value="marketing_tab"),
                 dcc.Tab(label="Tenants", value="tenants_tab"),
                 dcc.Tab(label="Portfolio", value="portfolio_tab"),
            ],
            value="marketing_tab",
        )

        ],

        className="row tabs_div"
        ),

        # Tab content
        html.Div(id="tab_content", style={"margin": "2% 3%"})

])

@app.callback(Output("tab_content", "children"),
          [
              Input("tabs", "value")
          ]
         )
def render_content(tab):
    """
    For user selections, return the relevant tab
    """
    if tab == "marketing_tab":
        return marketing.layout
    elif tab == "tenants_tab":
        return tenants.layout
    elif tab == "portfolio_tab":
        return portfolio.layout
    else:
        return marketing.layout


    # In[10]:

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

1 Ответ

1 голос
/ 18 июня 2019

Эта ссылка содержит несколько хороших примеров для вас.По сути, вы хотите, чтобы ваш обратный вызов обновил data таблицу.Примерно так: 

@app.callback(
    Output('my-table', 'data'),
    [Input('dropdown', 'value')])
def callback_a(i):
    df = pd.DataFrame(numpy.arange(30).reshape(5, 6))

    return df.to_dict(orient='records')

Важно, чтобы столбцы для таблицы были определены так, чтобы id для каждого столбца совпадало с именем столбца в кадре данных.Если вы изменяете данные в таблице, то вам может потребоваться другой обратный вызов / вывод для обновления также columns проп.

...