首页flask + pyecharts，在前端页面显示不了词云图也不报错

flask + pyecharts，在前端页面显示不了词云图也不报错

时间: 2023-05-28 21:05:43 浏览: 106

可能是因为您没有正确设置HTML页面中的元素ID或者没有正确调用pyecharts的渲染函数。以下是一个简单的例子，演示如何在Flask应用中使用pyecharts绘制词云图并在前端页面显示。 ```python from flask import Flask, render_template from pyecharts.charts import WordCloud from pyecharts.globals import SymbolType app = Flask(__name__) @app.route('/') def index(): # 构造词云图数据 words = [("Python", 100), ("Flask", 80), ("pyecharts", 60), ("前端", 50), ("后端", 40), ("数据分析", 30)] # 创建词云图对象，设置样式和数据 wordcloud = ( WordCloud() .add("", words, word_size_range=[20, 100], shape=SymbolType.DIAMOND) .set_global_opts(title_opts={"text": "词云图"}) ) # 使用render_embed()函数获取词云图的HTML代码 chart = wordcloud.render_embed() # 渲染模板并返回HTML页面 return render_template('index.html', chart=chart) if __name__ == '__main__': app.run(debug=True) ``` 在HTML模板中，您需要使用`{{ chart | safe }}`将词云图的HTML代码嵌入到页面中。以下是一个简单的HTML模板示例： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>词云图示例</title>  {{ chart.load_javascript() }} </head> <body>  {{ chart | safe }} </body> </html> ``` 请注意，您需要在HTML页面的<head>标签中引入pyecharts的JS库，否则词云图无法正常显示。此外，为了避免XSS攻击，使用`| safe`过滤器将HTML代码标记为安全，以便Flask可以将其呈现到页面中。

阅读全文