‍ 猫头虎 分享：Python库 Dash 的简介、安装、用法详解入门教程

pip install dash

pip install dash-bootstrap-components dash-table

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import plotly.express as px

# 初始化Dash应用
app = dash.Dash(__name__)

# 创建一个简单的数据集
df = px.data.gapminder().query("year == 2007")

# 定义布局
app.layout = html.Div(children=[
    html.H1(children='Hello Dash!'),
    
    html.Div(children='''
        Dash: A web application framework for Python.
    '''),

    dcc.Graph(
        id='example-graph',
        figure=px.scatter(df, x="gdpPercap", y="lifeExp", 
                          size="pop", color="continent",
                          hover_name="country", log_x=True, size_max=60)
    )
])

# 运行应用
if __name__ == '__main__':
    app.run_server(debug=True)
```上面的代码创建了一个简单的 Dash 应用，并且生成了一个交互式的散点图。运行这段代码后，你可以在本地服务器上查看这个图表，并进行各种交互操作。

## 深入理解 Dash 组件 🧩

在 Dash 中，一切都由组件构成。组件分为三大类：布局组件（如 `html.Div`）、核心组件（如 `dcc.Graph`）、以及扩展组件（如 `dash_table.DataTable`）。

### 布局组件

布局组件用于构建页面结构，比如 `html.Div` 用来包裹其他组件，`html.H1` 用来显示大标题，等等。

```python
html.Div([
    html.H1('我的 Dash 应用'),
    html.P('这是一个段落。')
])

dcc.Dropdown(
    id='my-dropdown',
    options=[
        {'label': '选项一', 'value': '1'},
        {'label': '选项二', 'value': '2'}
    ],
    value='1'
)

import dash_table

dash_table.DataTable(
    id='table',
    columns=[{"name": i, "id": i} for i in df.columns],
    data=df.to_dict('records'),
)

python -m venv venv
source venv/bin/activate
pip install dash