0
0
Lập trình
Thaycacac
Thaycacac thaycacac

Tìm hiểu về Superset và Cách Xây dựng Plugin Trực quan Tùy chỉnh trong Superset

Đăng vào 3 ngày trước

• 4 phút đọc

Giới thiệu

Chúc mọi người có sức khỏe và thành công trong công việc trong năm mới! Trong bối cảnh các doanh nghiệp đang tìm kiếm cách tối ưu chi phí, Apache Superset nổi lên như một giải pháp hữu ích cho việc phân tích và trực quan hóa dữ liệu với chi phí rất thấp. Trong bài viết này, chúng ta sẽ khám phá Superset và cách để tùy chỉnh các Plugin trực quan theo nhu cầu riêng.

1. Superset là gì?

Apache Superset là một nền tảng phân tích và trực quan hóa dữ liệu hiện đại, mã nguồn mở. Superset giúp các tổ chức thay thế hoặc tối ưu hóa các công cụ phân tích kinh doanh mà họ đang sử dụng. Nền tảng này có thể tích hợp với hầu hết các cơ sở dữ liệu SQL thông qua SQLAlchemy.

Một số lợi ích nổi bật của Superset:

  • Giao diện không cần mã (no-code interface) cho phép tạo biểu đồ và báo cáo nhanh chóng.
  • Trình chỉnh sửa SQL mạnh mẽ trên web hỗ trợ truy vấn nâng cao.
  • Lớp ngữ nghĩa nhẹ (lightweight semantic layer).
  • Các biểu đồ đẹp mắt với thiết kế màu sắc hấp dẫn, hỗ trợ nhiều kiểu biểu đồ từ đơn giản đến phức tạp.
  • Kiến trúc đám mây (cloud-native architecture) dễ dàng triển khai và mở rộng.

2. Khởi chạy Superset

Để bắt đầu với Superset và tạo ra biểu đồ đầu tiên, phương pháp dễ dàng nhất là sử dụng Docker Compose.

Các bước cần thực hiện:

  1. Clone mã nguồn Superset từ GitHub:
    Copy
    git clone https://github.com/apache/superset.git
    cd superset
  2. Khởi chạy Superset với Docker Compose:
    Copy
    docker compose -f docker-compose-non-dev.yml up -d
  3. Đảm bảo rằng tất cả 5 container đã được khởi động thành công.
  4. Chú ý rằng job superset_init sẽ tự động chạy để khởi tạo metadata.
  5. Truy cập vào localhost:8088, đăng nhập với tài khoản admin/admin và trải nghiệm.

3. Tạo Biểu đồ Đầu tiên với Superset

Trước khi tạo một biểu đồ (chart) trên Superset, bạn cần có một bảng dữ liệu (dataset) được xác định từ một database.

3.1 Tạo Kết Nối Database

Để tạo kết nối với database của bạn, đi tới Settings -> Database Connections -> +DATABASE và nhập thông tin cần thiết.

3.2 Tạo Dataset

Sau khi đã kết nối với Database, bạn có thể tạo Dataset:

  • Chọn Datasets -> +DATASET, nhập thông tin DATABASE, SCHEMA và TABLE để tạo Dataset. Một bảng trong Database có thể được coi là một Dataset trong Superset.

3.3 Tạo Biểu đồ

Để tạo một biểu đồ, bạn thực hiện như sau:

  1. Chọn Chart -> +CHART.
  2. Chọn Dataset và loại biểu đồ (Chart Type). Ví dụ: Dataset là user và loại biểu đồ là Big Number.
  3. Chọn CREATE NEW CHART.

Tại đây, bạn sẽ thấy giao diện dễ dàng để tạo truy vấn cho biểu đồ, lợi ích của giao diện không cần mã trở nên rõ rệt tại đây. Bạn có thể chọn Metric và Filters dễ dàng cho biểu đồ của mình, ví dụ, bạn có thể muốn đếm tất cả các user có team_id <> 40.

4. Xây dựng Plugin Trực quan Tùy chỉnh

Như đã đề cập, nếu công ty bạn cần một biểu đồ đặc biệt mà Superset không hỗ trợ, bạn có thể tùy chỉnh một Viz Plugin.

4.1 Cài Đặt Superset Yeoman Generator

Bạn cần cài đặt Yeoman Generator và template Superset plugin trong repo để tạo template Plugin:

bash Copy
npm i -g yo
npm i -g @superset-ui/generator-superset

4.2 Tạo một Viz Plugin Mới

  1. Tạo một thư mục để lưu template:
    Copy
    cd superset
    mkdir plugin-hello
    yo @superset-ui/superset
  2. Bạn sẽ được hỏi một số câu hỏi, bạn có thể để mặc định cho dễ quản lý.

Trong quá trình này, file quan trọng bạn cần lưu ý bao gồm:

  • src/plugin/controlPanel.ts: Tùy chỉnh bảng điều khiển để xây dựng câu truy vấn.
  • src/plugin/transformProps.ts: Xử lý dữ liệu sau khi truy vấn.
  • src/PluginHello.tsx: Component chính để tạo biểu đồ theo yêu cầu, cho phép tích hợp các thư viện biểu đồ như Chart.js, Nivo,…

Sau khi hoàn thành, bạn có thể xây dựng Plugin:

bash Copy
cd plugin-hello
npm ci && npm run build

4.3 Thêm Plugin vào Superset

Để thêm Plugin vào Superset, bạn cần vào thư mục superset-frontend và chạy lệnh:

bash Copy
npm i -S path/plugin-hello

Sau đó, khai báo Plugin bằng cách sửa đổi file superset-frontend/src/visualizations/presets/MainPreset.js. Nhập Plugin và thêm vào mảng plugin:

javascript Copy
import { PluginHello } from 'plugin-hello';
new PluginHello().configure({ key: 'hello' });

Cuối cùng, chạy server phát triển bằng lệnh npm run dev-server trong folder superset-frontend và truy cập localhost:9000 để kiểm tra.

4.4 Chế Độ Phát Triển

Để dễ dàng theo dõi các thay đổi, bạn có thể sử dụng chế độ phát triển:

bash Copy
cd plugin-hello
npm run dev
cd superset-frontend
npm run dev-server

5. Kết luận

Superset là giải pháp tốt cho phân tích và trực quan hóa dữ liệu. Với mã nguồn mở, Superset giúp giảm thiểu chi phí khi chuyển đổi từ các nền tảng tốn phí khác. Khả năng tùy chỉnh Plugin linh hoạt giúp đáp ứng tốt các nhu cầu đặc thù của từng doanh nghiệp.
source: viblo

Gợi ý câu hỏi phỏng vấn
Không có dữ liệu

Không có dữ liệu

Bài viết được đề xuất
Bài viết cùng tác giả

Bình luận

Chưa có bình luận nào

Chưa có bình luận nào