Plotly图不显示在HTML(Python)中

问题描述 投票:0回答:1

我正在尝试用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代码而不是用双引号作为文本包装?

谢谢你!

python html flask data-visualization plotly
1个回答
3
投票

经过大量的研究,我解决了自己的问题。我只需要在HTML模板中将其标记为安全{{graph1Plot | safe}}

或者在flask导入标记的.py文件中... graph1Plot =标记(graph1Plot)

© www.soinside.com 2019 - 2024. All rights reserved.