python - Plotly-Dash:下拉选项有效,但不会绘制数据
问题描述
我是 Dash 的新手。我正在尝试绘制一个简单的线图并添加一个下拉列表来更改来自数据框的数据(它与其他数据框嵌套在字典中)。这是数据框:
df_vals['corn']
time 2m_temp_prod 2m_temp_area total_precip_prod total_precip_area
0 2020-09-19 00:00:00 299.346777 299.799234 0.000000 0.000000
1 2020-09-19 06:00:00 294.039512 294.443352 0.191070 0.286952
2 2020-09-19 12:00:00 292.959274 293.182931 0.155765 0.216606
3 2020-09-19 18:00:00 301.318046 301.767516 0.421768 0.485691
4 2020-09-20 00:00:00 300.623567 300.979650 0.363572 0.501164
... ... ... ... ... ...
56 2020-10-03 00:00:00 301.177141 301.052273 0.371209 0.408515
57 2020-10-03 06:00:00 295.874298 295.720135 0.281793 0.300564
58 2020-10-03 12:00:00 293.838787 293.686738 0.586887 0.549365
59 2020-10-03 18:00:00 302.384474 302.191334 0.492712 0.493798
60 2020-10-04 00:00:00 300.920766 300.817993 0.522374 0.531138
这是我尝试绘图的代码。
app = JupyterDash(__name__)
cols=df_vals['corn'].columns[1:]
app.layout = html.Div([
html.Div([
html.Div([
dcc.Dropdown(
id='variables',
options=[{'label': i, 'value': i} for i in cols],
value='2m_temp_prod'
)
]),
dcc.Graph(id='plot')])
])
@app.callback(
Output('plot', 'figure'),
[Input('variables', 'value')])
def update_graph(variable_name):
fig=px.line(x=df_vals['corn']['time'], y=df_vals['corn'][variable_name])
return fig
app.run_server(mode='inline')
这使绘图具有正确的下拉选项,但没有绘制数据。我在这里做错了什么?试图按照 Dash 网站上的教程进行操作,但似乎遇到了一些问题。
解决方案
您肯定似乎在这里接近解决方案。我实际上认为你只是忘记了import plotly.express as px
。我花时间根据您在问题中提供的数据制作了适当的数据样本。在没有任何关于您的进口信息的情况下,我只需要使用我的标准 plotly 和 JupyteDash 进口。无论如何,下面的代码片段将产生以下情节。请看看我是如何设置你的数据框的。如果您花几分钟时间阅读这篇文章,您可以学习进行相同的设置。
Dash 应用程序 - 情节 1
下拉选择='2m_temp_prod'
Dash 应用程序 - 情节 2
**下拉选择 ='total_precip_prod''
完整代码
from jupyter_dash import JupyterDash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State, ClientsideFunction
import dash_bootstrap_components as dbc
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
import plotly.graph_objs as go
from dash.dependencies import Input, Output
import numpy as np
from plotly.subplots import make_subplots
import plotly.express as px
df=pd.DataFrame({'time':{0:'2020-09-1900:00:00',
1:'2020-09-1906:00:00',
2:'2020-09-1912:00:00',
3:'2020-09-1918:00:00',
4:'2020-09-2000:00:00',
5:'2020-10-0300:00:00',
6:'2020-10-0306:00:00',
7:'2020-10-0312:00:00',
8:'2020-10-0318:00:00',
60:'2020-10-0400:00:00'},
'2m_temp_prod':{0:299.346777,
1:294.039512,
2:292.95927400000005,
3:301.318046,
4:300.623567,
5:301.177141,
6:295.874298,
7:293.838787,
8:302.384474,
60:300.920766},
'2m_temp_area':{0:299.799234,
1:294.443352,
2:293.182931,
3:301.767516,
4:300.97965,
5:301.052273,
6:295.720135,
7:293.686738,
8:302.191334,
60:300.817993},
'total_precip_prod':{0:0.0,
1:0.19107000000000002,
2:0.15576500000000001,
3:0.42176800000000003,
4:0.363572,
5:0.371209,
6:0.28179299999999996,
7:0.5868869999999999,
8:0.492712,
60:0.522374},
'total_precip_area':{0:0.0,
1:0.286952,
2:0.216606,
3:0.485691,
4:0.501164,
5:0.408515,
6:0.300564,
7:0.549365,
8:0.49379799999999996,
60:0.531138}})
df_vals = {'corn':df}
app = JupyterDash(__name__)
cols=df_vals['corn'].columns[1:]
app.layout = html.Div([
html.Div([
html.Div([
dcc.Dropdown(
id='variables',
options=[{'label': i, 'value': i} for i in cols],
value='2m_temp_prod'
)
]),
dcc.Graph(id='plot')])
])
@app.callback(
Output('plot', 'figure'),
[Input('variables', 'value')])
def update_graph(variable_name):
fig=px.line(x=df_vals['corn']['time'], y=df_vals['corn'][variable_name])
fig.update_layout(template='plotly_dark')
return fig
app.run_server(mode='inline', debug=True)
推荐阅读
- android - Nested Recyclerview中删除子Item导致跳跃动画效果
- android - 在 FireTV 上按我的应用程序上的播放/暂停时启动 3rd 方音乐应用程序
- javascript - 将从另一个文件导入的异步函数的返回值存储为可以在 elseware 中引用的变量
- java - 如何设置带注释的 Multipart 的最大尺寸?
- wpf - WPF Ctrl+C 热键注册覆盖/停止典型的复制功能
- flutter - Dart - 如何处理多个套接字响应?
- java - 关于 Java 构造函数的练习
- laravel - npm 发现 1high 严重性漏洞
- c++ - memory_resource 中放置 new 运算符和 pmr 的区别?
- algorithm - PageRank算法给出奇怪的值