Динамическое добавление следов на графике с помощью контрольного списка - PullRequest
Новая
       23

Динамическое добавление следов на графике с помощью контрольного списка

2 голосов
/ 28 марта 2019

У меня есть набор данных с разными возрастными диапазонами в виде разных столбцов. Я пытаюсь создать динамические следы для каждого возрастного диапазона в Plotly, чтобы создать сравнительную гистограмму. Более того, я хотел бы, чтобы эти трассы были связаны с контрольным списком, чтобы я мог выбирать, какие кривые / бары показывать на результирующем графике. Однако у меня возникают проблемы с выяснением того, как связать этот контрольный список с полученными в результате трассами на графике, тем более что у меня также есть другие выпадающие списки, связанные с этим графиком. Вот пример кода 

    Gender=xl['Gender'].unique()
    Age=xl['Age'].unique()
    Activity=xl['Sport'].unique()

app=dash.Dash(__name__)

app.layout=html.Div(children=
[html.Div([
    html.H3('Age:', style={'paddingRight': '30px','fontSize':18}),

    dcc.Checklist(
        id='Age',
        options=[
            {'label': i, 'value': i} for i in Age],
    value='18-24' 
)], style={'width':'33%','display':'inline-block'}),

html.Div([
    html.H3('Gender:', style={'paddingRight': '30px','fontSize':18}),
    dcc.Dropdown(
        id='Gender', 
        options=[
            {'label': 'Male', 'value': 'Male'},
            {'label': 'Female', 'value': 'Female'}
        ],
        value='Male'
    )], style={'width':'33%','display':'inline-block'}),

html.H3('Activity:', style={'paddingRight': '30px','fontSize':18}), 

dcc.Dropdown(
id='Sport',
options=[
{'label': i, 'value': i} for i in Activity],
value='Yoga'
),
],style={'width':'33%','display':'inline-block'}),

html.Div([
    dcc.Graph(id='linear')]),

html.Div([
    dcc.Graph(id='linear2')
])])

@app.callback(
 dash.dependencies.Output('linear','figure'),
[dash.dependencies.Input('Gender','value'),
 dash.dependencies.Input('Sport','value'),
 dash.dependencies.Input('Age','value')])

def update_graph(Gender_name,sport_name,age_name):
      xl1=xl[xl['Gender'] == Gender_name]
      xl2=xl1[xl1['Sport'] == sport_name]
      xl3=xl2[xl2['Age'] == age_name]

      Total_x=xl3.Date

      trace1=go.Bar(x=Total_x,y=age_name?,name='6-12')
      trace2=go.Bar(x=Total_x,y=age_name?,name='12-18')
      trace3=go.Bar(x=Total_x,y=age_name,name='18-24')

      Totallayout=go.Layout(xaxis={'title': 'Year'},
                              yaxis={'title': 'Participants'},
                              title= 'Core Player Comparison',
                              hovermode='closest')


      return {'data':[trace2,trace1,trace3],
             'layout':[Totallayout]}

Я надеялся, что кто-нибудь сможет помочь мне с функцией графика обновления обновлений, чтобы она могла ссылаться на выпадающий список возраста, который я создал при создании различных трасс. Если бы кто-нибудь мог помочь, это было бы очень признательно, спасибо!

Пример кадра данных:

Дата Спорт Пол Возраст Игроки Базовые
2008 Йога Мужчина 6-12 2308,54 692,562
Йога 2008, мужчина 13-17 3551,60 1065,480
2008 Йога Мужчины 18-24 2663,70 799,110
2008 Йога Мужчина 25-34 3551,60 1065,480
2008 Йога Мужчины 35-44 2130,96 639,288

Идея состоит в том, чтобы создать график, где "Players" или "Core" - это ось Y, а Date - ось x, а Age - это следы.

1 Ответ

1 голос
/ 13 апреля 2019

Спасибо за обновление с образцом df. Я не совсем точно знаю, какова ваша цель, но у меня есть данные, проходящие через и отображающие df. Вот функциональный пример: 

dict_form = {
    'Date': [2008, 2008, 2008, 2008, 2008],
    'Sport': ['Yoga', 'Yoga', 'Yoga', 'Yoga', 'Yoga'],
    'Gender': ['Male', 'Male', 'Male', 'Male', 'Male'],
    'Age': ['6-12', '13-17', '18-24', '25-34', '35-44'],
    'Players': [2308.54, 3551.60, 2663.70, 3551.60, 2130.96],
    'Core': [692.562, 1065.480, 799.110, 1065.480, 639.288],
}

df = pandas.DataFrame.from_dict(dict_form)

app = dash.Dash(__name__)

app.layout = html.Div(children=[
    html.Div(children=[
        html.H3('Age:', style={'paddingRight': '30px', 'fontSize': 18}),

        dcc.Checklist(
            id='Age',
            options=[
                {'label': i, 'value': i} for i in df['Age']],
            values=['18-24']
            )
    ]),

    html.Div(children=[
        html.H3('Gender:', style={'paddingRight': '30px', 'fontSize': 18}),
        dcc.Dropdown(
            id='Gender',
            options=[
                {'label': 'Male', 'value': 'Male'},
                {'label': 'Female', 'value': 'Female'}
            ],
            value='Male'
        )
    ], style={'width': '33%', 'display': 'inline-block'}),

    html.H3('Activity:', style={'paddingRight': '30px', 'fontSize': 18}),
    dcc.Dropdown(
        id='Sport',
        options=[
            {'label': i, 'value': i} for i in df['Sport']],
        value='Yoga'
    ),

    html.Div([
        dcc.Graph(id='linear')]),

    html.Div([
        dcc.Graph(id='linear2')
    ])
], style={'width': '33%', 'display': 'inline-block'})


@app.callback(
    dash.dependencies.Output('linear', 'figure'),
    [dash.dependencies.Input('Gender', 'value'),
     dash.dependencies.Input('Sport', 'value'),
     dash.dependencies.Input('Age', 'values')])
def update_graph(gender_name, sport_name, age_name):
    df1 = df[df['Gender'] == gender_name]
    df2 = df1[df1['Sport'] == sport_name]
    df3 = df2[df2['Age'].isin(age_name)]

    total_x = df3.Age

    trace1 = go.Bar(x=total_x, y=df3['Players'], name='Players')
    trace2 = go.Bar(x=total_x, y=df3['Core'], name='Core')

    total_layout = go.Layout(xaxis={'title': 'Year'},
                             yaxis={'title': 'Participants'},
                             title='Core Player Comparison',
                             hovermode='closest')

    return {'data': [trace2, trace1],
            'layout': [total_layout]}


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

А вот скриншот карты:

Chart

...