Hãy tưởng tượng bạn có một tập dữ liệu với nhiều thông tin được sắp xếp theo các cột khác nhau mà bạn muốn trực quan hóa. Ngoài ra, bản thân nội dung có thể được hiển thị với cùng một loại biểu đồ, ví dụ: biểu đồ thanh hoặc biểu đồ đường, nhưng sẽ không có ý nghĩa gì khi hiển thị nội dung đó cùng một lúc. Rõ ràng, bạn có thể tạo một số ô con và trực quan hóa chúng bên dưới ô kia. Nhưng điều đó có thể vượt khỏi tầm kiểm soát nếu bạn có quá nhiều danh mục để hiển thị. May mắn thay, có một giải pháp đơn giản cho việc đó bằng cách tạo menu thả xuống trong Plotly. Vì vậy, chúng ta hãy xem làm thế nào để làm điều đó.

Cạo dữ liệu

Đầu tiên, chúng ta cần lấy dữ liệu. Trong ví dụ này, chúng tôi sẽ lấy số liệu thống kê NBA cho từng người chơi từ www.basketball-reference.com . Để đơn giản hóa, chúng tôi sẽ chỉ tập trung vào 10 cầu thủ hàng đầu về số điểm, số lần bật bóng và hỗ trợ mỗi trận:

# Scraping individual stats from www.basketball-reference.com
df = pd.read_html('https://www.basketball-reference.com/leagues/NBA_2023_per_game.html')[0]

# Filtering out irrelevant entries 
df = df[df['Player'] != 'Player']

# Converting columns into numeric type if possible
for col in df.columns:
    try:
        df[col] = pd.to_numeric(df[col])
    except:
        pass

# Filtering and sorting for categories of interest
df_pts = df[['Player', 'PTS']].sort_values('PTS', ascending=False)[:10]
df_trb = df[['Player', 'TRB']].sort_values('TRB', ascending=False)[:10]
df_ast = df[['Player', 'AST']].sort_values('AST', ascending=False)[:10]

      
                

                    
                    
                
            

Trong bước tiếp theo, chúng ta sẽ tạo một đối tượng hình chứa ba biểu đồ thanh. Mỗi biểu đồ thanh đại diện cho một danh mục khác nhau (điểm, số lần bật lại, hỗ trợ) mà chúng tôi đã phân biệt bằng cách tạo ba khung dữ liệu ở bước trước. Xin lưu ý, điều quan trọng là chỉ đặt tham số hiển thị cho biểu đồ thanh đầu tiên thành True và cho các tham số khác thành false :

# Initializing figure object
fig = go.Figure()

# Adding points bar plot
fig.add_trace(
    go.Bar(
        y=list(df_pts['Player']),
        x=list(df_pts['PTS']),
        name='Points',
        orientation='h'
    )
)

# Adding rebounds bar plot
fig.add_trace(
    go.Bar(
        y=list(df_trb['Player']),
        x=list(df_trb['TRB']),
        name='Rebounds',
        visible=False,
        orientation='h'
    )
)

# Adding assists bar plot
fig.add_trace(
    go.Bar(
        y=list(df_ast['Player']),
        x=list(df_ast['AST']),
        name='Assists',
        visible=False,
        orientation='h'
    )
)

# Minor layout adjustments
fig.update_layout(title='<b>Top 10 Leaders</b>', 
                  title_x=0.5,
                  margin=dict(t=50),
                  yaxis=dict(autorange="reversed", ticksuffix="  ")
                 )

fig.show()

      
                

                    
                    
                
            

Bây giờ, hãy thêm menu thả xuống vào đối tượng hình bằng phương thức update_layout . Trong tham số updatemenus , chúng ta cần chuyển danh sách từ điển cho tham số nút . Mỗi từ điển chỉ định như sau:

• nhãn: tên xuất hiện trên nút → ví dụ Điểm
• phương pháp: hành động được thực hiện khi nhấp chuột → cập nhật
• args: danh sách có từ điển xác định các ô hiển thị sau khi nhấp vào nhãn tương ứng → [True, False, False] để chỉ hiển thị biểu đồ thanh đầu tiên đã được thêm vào bằng phương pháp add_trace trong bước trước

fig.update_layout(
    updatemenus=[
        dict(
            xanchor='left',
            x=-0.15,
            yanchor='top',
            y=1.1,
            active=0,
            buttons=list([
                dict(label="Points",
                     method="update",
                     args=[{"visible": [True, False, False]}]
                    ),
                dict(label="Rebounds",
                     method="update",
                     args=[{"visible": [False, True, False]}]
                    ),
                dict(label="Assists",
                     method="update",
                     args=[{"visible": [False, False, True]}]
                    )
            ]),
        )
    ])

fig.show()

       
                

                    
                    
                
            

Trong bài viết này, tôi đã giải thích cách tạo menu thả xuống trong Plotly để trực quan hóa nhiều danh mục có trong các cột khác nhau của khung dữ liệu. Điều này đặc biệt hữu ích nếu bạn có nhiều danh mục để hiển thị nhưng không muốn tạo một biểu đồ riêng lẻ cho từng danh mục. Tôi hy vọng điều này hữu ích cho bạn và cảm ơn vì đã đọc!

Những bài viết liên quan

Nếu bạn thích bài viết này, bạn cũng có thể quan tâm đến những điều sau đây:

Tăng cấp mã hóa

Cảm ơn vì đã là một phần của cộng đồng của chúng tôi! Trước khi bạn đi:

• Vỗ tay cho truyện và theo dõi tác giả
• Xem thêm nội dung trong ấn phẩm Level Up Coding
• Khóa học phỏng vấn mã hóa miễn phí ⇒ Xem khóa học
• Theo dõi chúng tôi: Twitter | LinkedIn | bản tin