flask在一个页面上展示多个pyecharts图
时间: 2024-06-11 20:11:10 浏览: 10
要在一个页面上展示多个pyecharts图,您可以使用Flask的render_template函数来渲染一个包含多个图表的HTML模板。
首先,您需要创建一个包含多个图表的python脚本。例如,您可以使用以下代码创建两个饼图:
```python
from pyecharts import options as opts
from pyecharts.charts import Pie
from flask import Flask, render_template
app = Flask(__name__)
@app.route("/")
def index():
pie1 = (
Pie()
.add("", [list(z) for z in zip(["A", "B", "C", "D", "E"], [1, 2, 3, 4, 5])])
.set_global_opts(title_opts=opts.TitleOpts(title="Pie1"))
)
pie2 = (
Pie()
.add("", [list(z) for z in zip(["F", "G", "H", "I", "J"], [5, 4, 3, 2, 1])])
.set_global_opts(title_opts=opts.TitleOpts(title="Pie2"))
)
return render_template("index.html", pie1=pie1, pie2=pie2)
if __name__ == "__main__":
app.run(debug=True)
```
在这个示例中,我们定义了两个饼图,分别命名为pie1和pie2。在index()函数中,我们将这两个图表作为参数传递给render_template函数,以便在HTML模板中使用。
接下来,您需要创建一个HTML模板,用于在一个页面上展示这两个图表。例如,您可以使用以下代码创建一个包含两个容器的HTML模板:
```html
<!DOCTYPE html>
<html>
<head>
<title>Flask Pyecharts</title>
</head>
<body>
<div id="pie1" style="height:500px;width:500px;"></div>
<div id="pie2" style="height:500px;width:500px;"></div>
<script src="https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts-en.min.js"></script>
{{ pie1.render_embed() }}
{{ pie2.render_embed() }}
</body>
</html>
```
在这个示例中,我们定义了两个div容器,分别命名为pie1和pie2。在每个容器下方,我们使用pyecharts的render_embed()函数来生成图表的HTML代码,并将其嵌入到模板中。
最后,您需要运行这个应用程序,并通过浏览器访问它。如果一切正常,您应该能够在一个页面上看到两个饼图。