[英]Plotly Dash bar chart with dynamically changing bar width (or dynamically changing graphing frequencies)
[英]Dynamically changing bar chart according to inputs in Plotly Dash
在很长一段时间里,我都在尝试设计我的第一个 Dash 应用程序。 但是我没有成功,因此我想寻求帮助。
我想要实现的是一个应用程序,首先我input
一些数字,根据这些数字我对给定的dataframe
进行一些计算,然后做一个bar chart
。 这应该不难。
到目前为止,我得到的是:
app = Dash(__name__, external_stylesheets=external_stylesheets)
app.layout = html.Div(
[
html.I("Get me the first input needed", style={"margin-right": "115px"}),
html.I("Get me an additional input to the first one too!"),
html.Br(),
dcc.Input(id="input1", type="number", placeholder="", style={'marginRight':'10px'}),
dcc.Input(id="input11", type="number", placeholder="", style={'marginRight':'10px'}),
... another 3 very similar blocks for inputs,
dcc.Slider(min=0, max=10, step=1,
value=5,
id='my_slider',
marks={
1: {'label': '1 year', 'style': {'color': '#77b0b1'}},
2: {'label': '2 years'},
3: {'label': '3 years'},
4: {'label': '4 years'},
5: {'label': '5 years'},
6: {'label': '6 years'},
7: {'label': '7 years'},
8: {'label': '8 years'},
9: {'label': '9 years'},
10: {'label': '10 years'}
}),
dcc.Graph(id='bar-chart'),
dcc.Store(id='intermediate-value')
]
)
Slider 部分并没有真正使用,因为我被卡住了,但可以肯定的是我向你们展示了所有内容。 在这部分之后, callback
部分,我想使用这些输入来操作给定的 dataframe。在此之前,我对所有这一切的灵感都在这里:>https://dash.plotly.com/sharing-data-between-callbacks
@app.callback(
[Output('intermediate-value', 'data')],
# [Output(component_id="bar-chart", component_property="figure")],
[Input("input1", "value"),
Input("input11", "value"),
Input("input2", "value"),
Input("input22", "value"),
Input("input3", "value"),
Input("input33", "value"),
Input('my_slider', 'value')]
)
def get_output(input1, input11, input2, input22, input3, input33, my_slider):
global dff
user_adapt_perc= [0.025, 0.135, 0.34, 0.34, 0.16]
first_positions = df.shape[0] * input11
first_money= df.iloc[:int(first_positions ),]['count'].sum() * input1 * 12
second_positions = df.shape[0] * (input22)
second_money= df.iloc[int(first_positions):int(second_positions ),]['count'].sum() * input2 * 12
third_positions = df.shape[0] * (input33)
third_money = df.iloc[int(second_positions ):int(third_positions ),]['count'].sum() * input3 * 12
total_money = first_money + second_money + third_money
dff = pd.DataFrame({"year":[1,2,3,4,5], "cash":list(np.cumsum(user_adapt_perc) * all_money) - total_money })
return dff.to_dict()
变量all_money
是在整个 Dash 应用程序之前预先计算的东西,比方说 10 000 000。而df
只是一些用于计算重要部分的输入数字的 dataframe。 我必须返回 DataFrame 以外的东西,因为它不受支持。
在这部分之后,所有这些计算都是正确的,我正在尝试 plot 基于这些计算的条形图:
@app.callback(Output(component_id="bar-chart", component_property="figure"), Input('intermediate-value', 'data'))
def get_figure(dictionary_data):
dff2 = pd.DataFrame(dictionary_data)
barchart = px.bar(
data_frame=dff2,
x="rok",
y="uspora",
opacity=0.9,
barmode='group')
return barchart
当我输入所有内容时,出现错误:
dash._grouping.SchemaTypeValidationError: Schema: [<Output `intermediate-value.data`>]
Path: ()
Expected type: (<class 'tuple'>, <class 'list'>)
Received value of type <class 'dict'>:
我想这甚至在条形图之前就有了一些东西。 我也试图添加到 output 部分bar-chart
,但我从来没有达到这一点。
有什么帮助吗? 非常感激。
你能提示我/帮助我吗?
尝试改变你所拥有的:
return dff.to_dict()
对此:
return dff.to_dict(orient='records')
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.