Tạo dashboard phân tích dữ liệu bằng Dash

!pip install dash pandas plotly jupyter-dash

Chuẩn bị dữ liệu để phân tích

Bộ dữ liệu mẫu được sử dụng là bộ Iris nổi tiếng, chứa các thuộc tính về hoa và loại hoa. Dữ liệu này phù hợp để minh họa dashboard trực quan với nhiều biểu đồ khác nhau.

import pandas as pd

# Tải dữ liệu Iris
df = pd.read_csv('https://raw.githubusercontent.com/mwaskom/seaborn-data/master/iris.csv')
print(df.head())

Cấu trúc thư mục dự án (local)

Nếu xây dựng dự án dashboard trên máy tính, bạn nên tổ chức file như sau:

dash-dashboard/
├── app.py                # File chính khởi chạy Dash
├── assets/
│   └── style.css         # (Tuỳ chọn) File CSS để tùy chỉnh giao diện
├── data/
│   └── iris.csv          # Dữ liệu sử dụng
├── requirements.txt      # Danh sách thư viện cần cài
└── README.md             # Hướng dẫn sử dụng

Xây dựng layout cho dashboard

Dashboard phân tích dữ liệu cần có bố cục trực quan để hiển thị biểu đồ và các thành phần tương tác. Dash sử dụng dash_html_components để xây dựng layout HTML và dash_core_components để thêm dropdown, slider, graph…

from dash import Dash, html, dcc
import plotly.express as px

app = Dash(__name__)

# Layout dashboard
app.layout = html.Div([
    html.H1("Dashboard Phân tích dữ liệu Iris", style={'textAlign': 'center'}),
    dcc.Dropdown(
        id='species-dropdown',
        options=[{'label': species, 'value': species} for species in df['species'].unique()],
        value='setosa',
        clearable=False
    ),
    dcc.Graph(id='scatter-plot')
])

Thêm callback để tương tác dữ liệu

Callback trong Dash cho phép dashboard cập nhật biểu đồ khi người dùng tương tác với các thành phần (như dropdown hoặc slider). Trong ví dụ này, chúng ta sẽ cập nhật scatter plot dựa trên loài hoa được chọn.

from dash.dependencies import Input, Output

@app.callback(
    Output('scatter-plot', 'figure'),
    Input('species-dropdown', 'value')
)
def update_scatter(selected_species):
    filtered_df = df[df['species'] == selected_species]
    fig = px.scatter(
        filtered_df,
        x='sepal_length',
        y='sepal_width',
        color='species',
        size='petal_length',
        title=f'Dữ liệu hoa {selected_species.capitalize()}'
    )
    return fig

Chạy server Dash

Sau khi hoàn thiện layout và callback, bạn có thể chạy server Dash để truy cập dashboard trên trình duyệt.

if __name__ == '__main__':
    app.run_server(debug=True)

html.Div([
    dcc.Graph(
        figure=px.histogram(df, x='petal_length', color='species', nbins=20),
        id='histogram'
    )
])