我正在尝试使用来自 python 脚本的数据为 Web 应用程序创建交互式图表。
错误是来自 python 代码的数据没有在 chart.js 脚本上传输或更新,也没有在 html 上输出。
3个脚本的流程:来自python的标签和数据,进入chart.js以呈现条形图并在html上输出
当我将非洲(数据点)从 2447 更改为 5578 时,图表不会更新。我不确定问题是从 python 转移还是渲染图表。
Python
from flask import Flask,render_template
app = Flask(__name__)
@app.route("/")
def result():
labels = ["Africa", "Asia", "Europe", "Latin America", "North America"]
data = [5578,5267,734,784,433]
return render_template("result.html", labels=labels, data=data)
if __name__ == '__main__':
app.debug = True
app.run()
Run Code Online (Sandbox Code Playgroud)
脚本1.js
new Chart(document.getElementById("bar-chart"), {
type: 'bar',
data: {
labels: "{{labels}}",
datasets: [
{
label: "Population (millions)",
backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850"],
data: "{{data }}"
}
]
}, …Run Code Online (Sandbox Code Playgroud) 我试图将绘图表达树图上的点击链接到数据框上的过滤器。因此,当用户单击图表上的某个国家/地区时,数据框将筛选特定国家/地区,而不是显示所有国家/地区
对于plotly.graph_objects 有“使用点击回调更新点”,但我不确定如何使其适用于plotly express。
import numpy as np
df = px.data.gapminder().query("year == 2007")
df["world"] = "world" # in order to have a single root node
fig = px.treemap(df, path=['world', 'continent', 'country'], values='pop',
color='lifeExp', hover_data=['iso_alpha'],
color_continuous_scale='RdBu',
color_continuous_midpoint=np.average(df['lifeExp'], weights=df['pop']))
fig.show()
## when user clicks on a country in the tree-map, the get_data function filters the df and outputs specific data on the country
def get_data(df, click):
return df[df['country'] == click]
get_data(df,click)
Run Code Online (Sandbox Code Playgroud)