喜欢的条友记得关注、点赞、转发、收藏,你们的支持就是我最大的动力源泉。
前期基础教程:
「Python3.11.0」手把手教你安装最新版Python运行环境
讲讲Python环境使用Pip命令快速下载各类库的方法
Python启航:30天编程速成之旅(第2天)-IDE安装
【Python教程】JupyterLab 开发环境安装
Python启航:30天编程速成之旅(第22天)- Dash创建交互式 Web 应用
引言
Dash 是一个用于构建数据可视化和交互式 Web 应用程序的 Python 框架,由 Plotly 开发。它允许开发者快速创建具有响应式的用户界面,并且与 Flask 和 React.js 紧密集成。通过本教程,将学习如何使用 Dash 创建一个简单的交互式 Web 应用程序。
安装 Dash
使用 pip 安装 dash 及其相关依赖。
pip install dash
创建第一个 Dash 应用程序
导入必要的模块
首先,导入 dash 和其他必要的模块。
import dash
from dash import dcc, html
from dash.dependencies import Input, Output
import plotly.express as px
import pandas as pd
创建 Dash 应用实例
创建一个 Dash 应用实例,并设置应用程序的标题。
app = dash.Dash(__name__)
app.title = "我的第一个 Dash 应用"
加载数据
加载一些示例数据,用于创建图表。
# 示例数据
df = pd.DataFrame({
"Fruit": ["Apples", "Oranges", "Bananas", "Apples", "Oranges", "Bananas"],
"Amount": [4, 1, 2, 2, 4, 5],
"City": ["SF", "SF", "SF", "Montreal", "Montreal", "Montreal"]
})
创建布局
定义应用程序的布局,包括标题、下拉菜单和图表。
app.layout = html.Div(children=[
html.H1(children='水果销售数据'),
html.Div(children='''
选择城市:
'''),
dcc.Dropdown(
id='city-dropdown',
options=[{'label': city, 'value': city} for city in df['City'].unique()],
value='SF'
),
dcc.Graph(id='fruit-sales-chart')
])
添加回调函数
使用回调函数来处理用户输入并更新图表。
@app.callback(
Output('fruit-sales-chart', 'figure'),
[Input('city-dropdown', 'value')]
)
def update_graph(selected_city):
filtered_df = df[df.City == selected_city]
fig = px.bar(filtered_df, x="Fruit", y="Amount", title=f"水果销售数据 ({selected_city})")
return fig
运行应用程序
最后,启动 Dash 应用程序。
if __name__ == '__main__':
app.run_server(debug=True)
完整代码示例
以下是上述步骤的完整代码示例:
import dash
from dash import dcc, html
from dash.dependencies import Input, Output
import plotly.express as px
import pandas as pd
# 创建 Dash 应用实例
app = dash.Dash(__name__)
app.title = "我的第一个 Dash 应用"
# 示例数据
df = pd.DataFrame({
"Fruit": ["Apples", "Oranges", "Bananas", "Apples", "Oranges", "Bananas"],
"Amount": [4, 1, 2, 2, 4, 5],
"City": ["SF", "SF", "SF", "Montreal", "Montreal", "Montreal"]
})
# 创建布局
app.layout = html.Div(children=[
html.H1(children='水果销售数据'),
html.Div(children='''
选择城市:
'''),
dcc.Dropdown(
id='city-dropdown',
options=[{'label': city, 'value': city} for city in df['City'].unique()],
value='SF'
),
dcc.Graph(id='fruit-sales-chart')
])
# 添加回调函数
@app.callback(
Output('fruit-sales-chart', 'figure'),
[Input('city-dropdown', 'value')]
)
def update_graph(selected_city):
filtered_df = df[df.City == selected_city]
fig = px.bar(filtered_df, x="Fruit", y="Amount", title=f"水果销售数据 ({selected_city})")
return fig
# 运行应用程序
if __name__ == '__main__':
app.run_server(debug=True)
总结
通过本教程,相信大家已经学会了如何使用 Python 常用库 Dash 创建一个简单的交互式 Web 应用程序。Dash 提供了许多强大的功能,可以快速构建数据可视化和交互式 Web 应用。希望大家喜欢这个教程,并继续探索更多 Dash 的功能!
喜欢的条友记得关注、点赞、转发、收藏,你们的支持就是我最大的动力源泉。