Dash 第一个应用
创建一个简单的 Dash 应用 在上一章节我们已经介绍了如何安装 Dash，为了确保 Dash 安装正确，我们可以创建一个简单的 Dash 应用来测试。 1. 创建一个 Python 文件 在你的项目目录中创建一个新的
创建一个简单的 Dash 应用
在上一章节我们已经介绍了如何安装 Dash，为了确保 Dash 安装正确，我们可以创建一个简单的 Dash 应用来测试。
1. 创建一个 Python 文件
在你的项目目录中创建一个新的 Python 文件，例如 app.py。
2. 编写代码
在 app.py 文件中，输入以下代码：
实例
# 导入 Dash 相关库
import dash
from dash import dcc, html # dcc 是 Dash 核心组件库，html 是 HTML 组件库
# 创建一个 Dash 应用实例
app = dash.Dash(__name__)
# 定义应用的布局
app.layout = html.Div(children=[
# 添加一个标题
html.H1(children='你好，Dash！'),
# 添加一段描述文字
html.Div(children='''
Dash：一个用于 Python 的 Web 应用框架。
'''),
# 添加一个图表
dcc.Graph(
id='example-graph', # 图表的 ID，用于回调函数
figure={
'data': [ # 图表的数据
{'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': '上海'},
{'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': '北京'},
],
'layout': { # 图表的布局
'title': 'Dash 数据可视化示例' # 图表的标题
}
}
)
])
# 运行应用
if __name__ == '__main__':
app.run(debug=True) # 启动应用，debug=True 表示开启调试模式
import dash
from dash import dcc, html # dcc 是 Dash 核心组件库，html 是 HTML 组件库
# 创建一个 Dash 应用实例
app = dash.Dash(__name__)
# 定义应用的布局
app.layout = html.Div(children=[
# 添加一个标题
html.H1(children='你好，Dash！'),
# 添加一段描述文字
html.Div(children='''
Dash：一个用于 Python 的 Web 应用框架。
'''),
# 添加一个图表
dcc.Graph(
id='example-graph', # 图表的 ID，用于回调函数
figure={
'data': [ # 图表的数据
{'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': '上海'},
{'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': '北京'},
],
'layout': { # 图表的布局
'title': 'Dash 数据可视化示例' # 图表的标题
}
}
)
])
# 运行应用
if __name__ == '__main__':
app.run(debug=True) # 启动应用，debug=True 表示开启调试模式
3. 运行应用
在终端中运行以下命令来启动 Dash 应用：
python app.py
如果一切正常，你将看到类似以下的输出：
Dash is running on http://127.0.0.1:8050/ * Serving Flask app 'test' * Debug mode: on
打开浏览器并访问 http://127.0.0.1:8050/，你将看到一个简单的 Dash 应用页面，显示标题、文本和一个柱状图，如下所示
通过以上步骤，我们已经成功运行了一个简单的 Dash 应用。
Dash 是一个功能强大且易于使用的框架，特别适合用于数据可视化和交互式 Web 应用的开发。