Làm cách nào để sử dụng CSS trong Dash Python?

Dash là một khung Python cho phép bạn xây dựng bảng điều khiển ứng dụng web tương tác. Dash có thể tạo tất cả các loại ứng dụng phân tích – bảng điều khiển tài chính, dựa trên web, học máy, y tế và sản xuất và bạn chỉ cần Python – không cần biết JavaScript, HTML hoặc CSS, vì Dash trừu tượng hóa tất cả chúng

Framework được xây dựng dựa trên Flask, Plotly. js và phản ứng. js và nó là mã nguồn mở;

Một ứng dụng Dash bao gồm hai khối chính

1. Cách trình bày. mô tả ứng dụng trông như thế nào
2. gọi lại. mô tả tính tương tác của ứng dụng

Dash cung cấp các lớp Python cho tất cả các thành phần trực quan của ứng dụng (một lớp Python giống như một phác thảo để tạo một đối tượng mới). Dash chứa các Thành phần cốt lõi của Dash cho phép bạn tạo danh sách thả xuống, thanh trượt, hộp kiểm, biểu đồ, v.v. và nó cũng chứa các Thành phần HTML của Dash để tạo nội dung HTML như hình ảnh, tiêu đề, v.v. Đây là 2 thành phần cơ bản để tạo bố cục, tuy nhiên Dash có thể sử dụng một số thư viện thành phần mã nguồn mở như Dash Bootstrap Components hay Dash Tables

Thực hành – Tạo một ứng dụng Dash đơn giản

Hãy bắt đầu tạo một ứng dụng Dash đơn giản, sử dụng dữ liệu chứng khoán của Yahoo Finance. Đầu tiên, hãy cài đặt các gói

Khi các gói đã được cài đặt và chúng tôi đã có dữ liệu, chúng tôi có thể bắt đầu với bố cục

Bước đầu tiên là khởi chạy ứng dụng Dash, sau đó thiết kế bố cục của chúng tôi. chúng ta sẽ thêm các phần hoặc phần bằng html. Div() để tách tất cả các đối tượng. Đầu tiên, chúng ta sẽ tạo một phần để thêm tiêu đề, sử dụng các Thành phần HTML như H1, H2, v.v. và tạo kiểu cho nó (như trong phát triển web thuần túy)

Tiếp theo, chúng tôi thêm danh sách thả xuống với dcc. Dropdown() từ Dash Core Components và cả biểu đồ, với html. đồ thị(). Chúng tôi sẽ không chỉ định loại biểu đồ ngay bây giờ nhưng trên các cuộc gọi lại, vì vậy chúng tôi có thể tạo tương tác giữa trình đơn thả xuống và biểu đồ

Để xem ứng dụng của chúng tôi, chúng tôi cần chạy máy chủ web của mình

Ứng dụng hiện sẽ chạy trên máy chủ cục bộ của chúng tôi trong trình duyệt web

Khi bố cục của chúng tôi đã sẵn sàng, chúng tôi có thể thêm tính tương tác giữa các đối tượng; . Dash cung cấp @app. trình trang trí gọi lại (trình trang trí Python nhận một hàm, thêm một số chức năng và trả về nó) sẽ thêm logic đầu vào/đầu ra cho các hàm khác nhau của chúng ta

Trong trường hợp này, cuộc gọi lại của chúng tôi sẽ sử dụng biểu đồ làm đầu ra và danh sách thả xuống làm đầu vào, vì vậy chúng tôi có thể hình dung các công ty mà chúng tôi chọn từ danh sách thả xuống

Tại sao Dash?

Ví dụ mà chúng ta đã thấy chỉ là một ví dụ nhỏ về những gì Dash có thể làm – nó có nhiều chức năng hơn để cung cấp hơn những gì chúng tôi đã giới thiệu trong bài viết này

Dash là một lựa chọn tuyệt vời cho người dùng Python làm việc về phân tích dữ liệu, khám phá dữ liệu, trực quan hóa, lập mô hình, báo cáo, v.v. Hợp nhất Python với các ngôn ngữ phát triển web như HTML và CSS cho phép chúng tôi xây dựng các đối tượng có khả năng tùy biến cao với kích thước, vị trí, màu sắc, phông chữ phù hợp, v.v. Dấu gạch ngang cũng có thể được sử dụng với R, Julia và Jupyter

Nếu bạn đang có kế hoạch xây dựng một ứng dụng cấp doanh nghiệp theo phong cách riêng và tạo các đối tượng thú vị và phức tạp một cách dễ dàng bằng Python, thì Dash là lựa chọn phù hợp. Và đừng ngần ngại liên hệ với nhóm chuyên gia của chúng tôi nếu bạn cần trợ giúp xây dựng và triển khai các ứng dụng dữ liệu tùy chỉnh của mình

Một thẻ đã tồn tại với tên chi nhánh được cung cấp. Nhiều lệnh Git chấp nhận cả tên thẻ và tên nhánh, vì vậy việc tạo nhánh này có thể gây ra hành vi không mong muốn. Bạn có chắc chắn muốn tạo nhánh này không?

Tạo kiểu cho ứng dụng Dash của bạn

Giao diện trực quan hóa dữ liệu trong Python với Dash
02. 29

Đánh dấu là đã hoàn thành

Trở thành Thành viên để tham gia cuộc trò chuyện

CSS có phải là một thành phần của dấu gạch ngang không?

Dấu gạch ngang trong Python dùng để làm gì?

Bố cục ứng dụng trong dấu gạch ngang là gì?

Định dạng tệp CSS là gì?