[英]Plotly dash, updating a live figure on a dash application jinja?
I have a BI interview in a few days and they want me to prepare a dashboard.几天后我有一个 BI 面试,他们要我准备一个仪表板。 I don't have access to power BI or Tableau so I'm trying to build up something with Plotly dash however I haven't really built anything fancy using it and I'm a bit inexperienced.
我无法访问 Power BI 或 Tableau,因此我正在尝试使用 Plotly dash 构建一些东西,但是我并没有真正使用它构建任何花哨的东西,而且我有点缺乏经验。 I'm pretty new to web development and come from a data background.
我对 web 开发非常陌生,并且来自数据背景。 I was hoping someone may be able to enlighten me on how I could jinja in Plotly dash.
我希望有人能够启发我如何在 Plotly dash 中使用 jinja。
I have my app layout below, someone helped me fix the drop-down issue I had and it's coming together and I was hoping one of the geniuses on here might be able to help me out.我在下面有我的应用程序布局,有人帮我解决了我遇到的下拉问题并且它正在组合在一起,我希望这里的一位天才能够帮助我。 The bit I'm trying to update is where it is saying total number jobs and then feed in a value calculated elsewhere.
我要更新的一点是它说的工作总数,然后输入在其他地方计算的值。 I know in HTML you would use {{}} but this is throwing an error.
我知道在 HTML 你会使用 {{}} 但这会引发错误。
Also if you are a plotly dash wizard, please can you help me figure out to have my dashboard laid out differently.此外,如果您是 plotly 仪表板向导,请您帮我弄清楚我的仪表板布局不同。 The layout is currently
目前的布局是
Figure Figure FIgure Figure图 图 图 图
but I'm trying to make it look more like但我试图让它看起来更像
Figure Figure Text Figure Figure图 图 文字 图 图
I love how amazing the community here is and thanks for your help in advance.我喜欢这里的社区有多棒,并提前感谢您的帮助。
app.layout = html.Div([
html.H1("New York City Job Postings",
style = {'text-align': 'center', 'font-family': 'Helvetica'}
),
html.P('The total number of jobs is:', {{number_of_jobs}}),
html.Div(
className="row",
children=[
html.Div(
className="eight columns",
children=[
html.Div(
#Job postings graph
dcc.Graph(
id='left-graph',
figure=fig,
)
),
#Most job vacancies
html.Div(
dcc.Graph(
id='right-graph',
figure=fig5
)
)
]
),
]
),
html.Div(
className="six columns",
children=[
html.Div(
[html.H2('Job posting type report', style
={'margin-right': '2em', 'font-family': 'Helvetica'})
]),
dcc.Dropdown(id='report_type',
options=[
{'label': 'Full vs part time ', 'value': 'OPT1'},
{'label': 'Internal vs external', 'value': 'OPT2'}
],
placeholder='Select a report type',
multi=False,
clearable=False,
style={'width':800,
'padding':3,
'font-size':20,
'text-align-last':'center',
'font-family': 'Helvetica'}),
dcc.Graph(id='report_type_', figure = {}),
#Salary Distributions
html.Div(
[html.H3('Salary Visuals', style=
{'margin-right': '2em', 'font-family': 'Helvetica'}
)
]
),
dcc.Dropdown(id='salary_visuals',
options=[
{'label': 'Distribution Plot', 'value': 'OPT1'},
{'label': 'Box Plot', 'value': 'OPT2'}
],
placeholder='Select a report type',
multi=False,
clearable=False,
style={'width':800,
'padding':3,
'font-size':20,
'text-align-last':'center',
'font-family': 'Helvetica'
}
),
dcc.Graph(id='salary_distribution',
figure = {}
)])
])
Welcome to the Dash community @user14219014,欢迎来到 Dash 社区@user14219014,
If you don't need to use the callback because you don't need user interaction, you can do something like:如果您不需要使用回调,因为您不需要用户交互,您可以执行以下操作:
jobs = len(df)
html.P('The total number of jobs is: {}'.format(jobs))
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.