我正在尝试用Python创建一个仪表板,使用Plotly作为图形,使用HTML作为前端。
在我的app.py中,我定义了图表,然后:
graph1Plot = plotly.offline.plot(graph1,
config={"displayModeBar": False},
show_link=False, include_plotlyjs=False,
output_type='div')
return render_template('layouts/index.html', graph1Plot=graph1Plot)
在我有的HTML模板中:
`<head>
...
<script src="https://d14fo0winaifog.cloudfront.net/plotly-basic.js">
</script>
</head>
<body>
...
<div id=1>{{ graph1Plot }}> </div>
...`
但它只是显示包含在“”中的div的内容,而不是实际的情节。如果我粘贴div的文字内容,它确实有效,但这对我来说不是解决方案。例如
`<div id="b03d4a83-ac91-4125-9d6e-4c62d9e32298" style="height: 100%; width: 30%;display: inline-block;" class="plotly-graph-div"></div>
<script type="text/javascript">window.PLOTLYENV=window.PLOTLYENV || {};window.PLOTLYENV.BASE_URL="https://plot.ly";Plotly.newPlot("b03d4a83-ac91-4125-9d6e-4c62d9e32298", [{"type": "bar", "x": ["apples", "bananas", "pears", "pineapples", "watermelons", "strawberries"], "y": [231, 12, 321, 33, 44, 423]}], {"title": "Bar Plot", "yaxis": {"title": "Count"}, "xaxis": {"title": "Fruit"}}, {"showLink": false, "linkText": "Export to plot.ly", "displayModeBar": false})</script>`
我缺少什么使div的内容显示为HTML代码而不是用双引号作为文本包装?
谢谢你!
经过大量的研究,我解决了自己的问题。我只需要在HTML模板中将其标记为安全{{graph1Plot | safe}}
或者在flask导入标记的.py文件中... graph1Plot =标记(graph1Plot)