Flask Plotly Dash integration

Question

我开始了第一次使用Flask和Plotly Dash创建基于web的仪表板的体验。我想知道我是否可以在Flask应用程序中嵌入Dash组件。

Answer 1

如果在短划线中使用"px"，则可以使用以下方法进行解析：

fig = px.bar(df, x='Fruit', y='Amount', color='City', 
barmode='group')    graphJSON = 
json.dumps(fig,cls=plotly.utils.PlotlyJSONEncoder)    
return render_template('notdash.html', plot=graphJSON)

如果使用'go'：

data = [
go.Bar(
x=df['x'], # assign x as the dataframe column 'x'
y=df['y']
)
]
graphJSON = json.dumps(data, cls=plotly.utils.PlotlyJSONEncoder)
return render_template('notdash.html', plot=graphJSON)

用于前端在HTML的标题中添加此行：

<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"> 
</script>

你可以简单地绘制你的图形，就像在下面写几行一样：

<div class = "divider py-1 text-center text-white bg-dark">Plotly data</div>
<div class="chart" id="linegraph">
<script>
var layout = { title : "", xaxis : {title: "Date+Time",dtick: 1,type: 
'category' },
yaxis :{title: "whatever"}}
var graphs = {{plot | safe}};
Plotly.plot('linegraph',graphs,layout);
</script>