Giao diện
Câu hỏi thường gặp (FAQ) — Graph Collection Manager
Câu hỏi chung
Biểu đồ quá lớn, khó xem. Làm sao?
Có nhiều cách giảm bớt noise:
- Select Collections: Chọn chỉ nhóm collection cần xem
- Connector type: Lọc chỉ hiển thị quan hệ entity hoặc inherited
- Locate Collection: Tìm nhanh collection cụ thể và zoom đến vị trí đó
- Zoom: Dùng Ctrl/Cmd + cuộn chuột để phóng to/thu nhỏ
- MiniMap: Dùng bản đồ thu nhỏ góc dưới phải để điều hướng nhanh
Có thể xuất biểu đồ thành hình ảnh không?
Plugin có tích hợp @antv/x6-plugin-export nhưng hiện tại chưa có nút export trên giao diện. Cách thay thế: dùng tính năng Screenshot của trình duyệt hoặc Fullscreen mode để chụp màn hình.
Quan hệ belongsToMany (N:M) hiển thị như thế nào?
Quan hệ N:M hiển thị bằng hai đường nối đi qua bảng trung gian (through table). Khi hover vào edge, cả hai đường và bảng trung gian đều được highlight.
Vị trí node lưu ở đâu?
Vị trí được lưu trong bảng graphPositions trên server (database). Điều này có nghĩa:
- Vị trí đồng bộ giữa các trình duyệt/thiết bị
- Admin khác cũng thấy cùng layout
- Mỗi collection chỉ có một vị trí (unique theo
collectionName)
Plugin có ảnh hưởng đến hiệu suất hệ thống không?
Không. Plugin chỉ đọc dữ liệu collection và relation từ Collection Manager, không thay đổi gì. Bảng graphPositions rất nhẹ (chỉ lưu toạ độ). Phần render đồ thị chạy hoàn toàn phía client.
Tính năng kế thừa (Inherited) hiển thị khi nào?
Chỉ hiển thị khi database là PostgreSQL (vì chỉ PostgreSQL hỗ trợ table inheritance). Với MySQL hoặc SQLite, các edge loại "inherited" sẽ không xuất hiện.
Thao tác trên đồ thị
Làm sao kéo-thả node?
Nhấn giữ chuột vào node và kéo đến vị trí mong muốn. Sau khi thả, vị trí mới tự động lưu lên server.
Auto layout hoạt động thế nào?
Nút Auto layout (biểu tượng cây) chạy thuật toán dagre để tự động sắp xếp:
- Node có quan hệ (edge) được sắp xếp dạng đồ thị có hướng (top-bottom)
- Node không có quan hệ (orphan) được sắp xếp dạng lưới phía dưới
- Vị trí mới được lưu lên server
Selection mode dùng khi nào?
Bật Selection mode (switch) để chọn nhiều node cùng lúc bằng cách giữ Shift + kéo vùng. Hữu ích khi muốn di chuyển nhóm node cùng lúc.
Xử lý lỗi thường gặp
Không thấy nút "Graphical interface" trong menu
Kiểm tra:
- Plugin đã được kích hoạt trong Plugin Manager
- Tài khoản có quyền truy cập (ACL snippet
pm.data-source-manager.graph-collection-manager) - Thử refresh trang
Đồ thị trống, không hiển thị collection nào
- Đảm bảo hệ thống có ít nhất một collection
- Kiểm tra không có filter đang áp dụng (query parameter
?collections=...trong URL) - Kiểm tra console log trình duyệt xem có lỗi JavaScript không
Node bị chồng lên nhau
Nhấn nút Auto layout để sắp xếp lại tự động. Nếu vẫn bị chồng (nhiều collection), thu nhỏ bằng Ctrl/Cmd + cuộn chuột hoặc dùng Select Collections để lọc bớt.
Kéo node nhưng vị trí không lưu
Kiểm tra:
- Kết nối mạng hoạt động (vị trí lưu qua API)
- Không đang ở chế độ Select Collections (khi chọn tập con, vị trí không lưu để tránh ghi đè layout chính)
- Console log có báo lỗi API không
Câu hỏi kỹ thuật
Plugin sử dụng thư viện đồ thị nào?
- @antv/x6 v2: Thư viện graph visualization chính
- dagre: Thuật toán auto layout cho directed graph
- Các plugin @antv/x6: Scroller, MiniMap, Selection, Snapline, Export, DnD
API endpoint nào được sử dụng?
| Resource | Action | Mô tả |
|---|---|---|
graphPositions | list | Lấy danh sách vị trí đã lưu |
graphPositions | create | Tạo vị trí mới cho collection |
graphPositions | update | Cập nhật vị trí (sau khi kéo-thả) |
collections | list | Lấy danh sách collection + fields + relations |