Biểu đồ và figure Plotly

Xây dựng Dashboard với Dash và Plotly

Alex Scriven

Data Scientist

Dash là gì?

Thư viện Python tạo ứng dụng web tương tác

Ưu điểm:

Miễn phí! Không như Tableau hay PowerBI
Tận dụng JavaScript chỉ với Python
Ít mã hơn so với framework web

Plotly và Dash

Hoạt động tốt cùng nhau

Dash: bảng điều khiển tương tác với nhiều biểu đồ Plotly
Xem ví dụ
- Ảnh, văn bản và biểu đồ
- Xem mã nguồn

Ảnh chụp màn hình bảng điều khiển tài chính với nhiều biểu đồ, văn bản, bảng và ảnh; gồm biểu đồ đường nổi bật có chi tiết khi hover

Plotly là gì?

Ôn Plotly, tập trung vào Dash
Thư viện Python tạo biểu đồ hiện đại, tương tác
- Gói bọc JavaScript nhưng viết bằng Python
Tạo biểu đồ với plotly.express

Xem khóa Giới thiệu Trực quan hóa dữ liệu với Plotly trong Python

Dữ liệu e-commerce của chúng ta

Bộ dữ liệu doanh số thương mại điện tử

Chi tiết:
- Nhóm hàng (Chính, Phụ) + mô tả
- Đơn giá, số lượng (+ Giá trị đơn hàng)
- Quốc gia
- Năm-Tháng bán hàng

Minh họa doanh số thương mại điện tử

Biểu đồ đường với plotly.express

import plotly.express as px

line_graph = px.line(

  data_frame=ecom_sales,
  x='Year-Month',
  y='Total Sales ($)', 
  title='Total Sales by Month')

line_graph.show()

Ảnh gif biểu đồ đường doanh số theo tháng; di chuột để hiện tháng và giá trị doanh số

Biểu đồ cột với plotly.express

bar_fig = px.bar(
  data_frame=ecom_sales,
  x='Total Sales ($)',
  y='Country',
  title='Total Sales by Country',

  orientation='h')

bar_fig.show()

Ảnh gif biểu đồ cột ngang: tổng doanh số trên trục x, quốc gia trên trục y. Di chuột để hiện dữ liệu

Tùy chỉnh biểu đồ Plotly

Thay đổi độ rộng cột của biểu đồ cột:

bar_fig.update_layout({'bargap': 0.5})

bar_fig.show()

Xem thêm tài liệu Plotly

Ảnh biểu đồ cột ngang: tổng doanh số trên trục x, quốc gia trên trục y. Giống slide trước nhưng khoảng cách giữa các cột nhỏ hơn.

Ayo berlatih!

Xây dựng Dashboard với Dash và Plotly