Bắt đầu ngayBắt đầu miễn phí

Thay đổi biểu đồ đường với Select

Ở nhiệm vụ cuối cùng, quỹ đầu cơ yêu cầu bạn tạo các trực quan hóa để phân tích hiệu suất cổ phiếu của Electronic Arts.

Bạn quyết định dùng widget Select là phù hợp, để họ có thể chuyển giữa các chỉ số sau: close, market_cap và volume.

Bộ dữ liệu stocks đã được lọc cho EA. Ba figure (close, market_cap và volume) và các bộ glyph (close_line, market_cap_line, volume) đã được tạo cho từng chỉ số và tải sẵn cho bạn.

Bài tập này là một phần của khóa học

Trực quan hóa dữ liệu tương tác với Bokeh

Xem khóa học

Hướng dẫn bài tập

  • Tạo menu bằng cách gọi Select(), truyền một danh sách cho đối số options chứa "Close", "Market Cap" và "Volume" (theo đúng thứ tự đó), đặt value là "Close", và đặt tiêu đề "Metric".
  • Gọi phương thức phù hợp của menu để liên kết "value" của widget với callback.
  • Gọi layout bên trong show, hiển thị widget phía trên các figure close, market_cap và volume.

Bài tập tương tác thực hành trực tiếp

Hãy thử làm bài tập này bằng cách hoàn thành đoạn mã mẫu này.

# Create menu
menu = ____
callback = CustomJS(args=dict(plot_one=close, plot_two=market_cap, plot_three=volume, line_1=close_line, line_2=market_cap_line, line_3=volume_line), code="""
plot_one.visible = true
plot_two.visible = true
plot_three.visible = true
line_1.visible = true
line_2.visible = true
line_3.visible = true
if (this.value == "Close") {plot_two.visible = false
                            plot_three.visible = false
                            line_2.visible = false
                            line_3.visible = false}
    else {plot_one.visible = false
          line_1.visible = false} 
if (this.value == "Market Cap") {plot_one.visible = false
                                 plot_three.visible = false
                                 line_1.visible = false
                                 line_3.visible = false} 
    else {plot_two.visible = false
          line_2.visible = false}
if (this.value == "Volume") {plot_one.visible = false
                             plot_two.visible = false
                             line_1.visible = false
                             line_2.visible = false}
    else {plot_three.visible = false
          line_3.visible = false}
""")

# Set up the interaction
____

# Display the layout
output_file(filename="stock_metrics.html")
____
Chỉnh sửa và Chạy Mã