MindFusion.Diagramming for JavaScript

Tổng quan

MindFusion.Diagramming for JavaScript tập trung vào nhu cầu xây dựng flow diagram trên web bằng các node shape dựng sẵn và links kết nối giữa các node. Người dùng trong ứng dụng có thể trực tiếp tạo, thay đổi kích thước, chọn, di chuyển và chỉnh sửa các phần tử sơ đồ ngay trong trình duyệt.

Thư viện được viết hoàn toàn bằng JavaScript và dùng HTML5 Canvas để dựng hình. Trên các trình duyệt hiện đại, thành phần này không yêu cầu phụ thuộc bên thứ ba khi chạy, phù hợp cho các ứng dụng cần triển khai diagram editor gọn nhẹ ở phía client.

Thư viện vẽ sơ đồ JavaScript dùng HTML5 Canvas, hỗ trợ React, Vue, Angular và Blazor. Cho phép tạo, chỉnh sửa, bố cục tự động và tùy biến node, link ngay trong trình duyệt.

Tính năng nổi bật

• ✓Camera Metadata — Cung cấp predefined node shapes cho workflow diagram, process scheme, genealogy tree và graph.
• ✓Cho phép tự định nghĩa node shapes theo mô hình hiển thị riêng.
• ✓Hỗ trợ labels hoặc images làm nền cho từng node.
• ✓Tùy biến connectors với đường thẳng, đường cong và nhiều kiểu arrowhead.
• ✓Cho phép đổi màu và vị trí của connectors theo yêu cầu giao diện.
• ✓Hỗ trợ tạo, resize, select, move và modify node cùng link trực tiếp.
• ✓Xử lý mouse events và touch events trên nhiều trình duyệt, nền tảng.

Ứng dụng thực tế

• Trình biên tập flowchart trong ứng dụng web nội bộ.
• Màn hình mô tả quy trình nghiệp vụ bằng process scheme.
• Sơ đồ tổ chức, class hierarchy hoặc graph trực quan trên trình duyệt.
• Ứng dụng React, Vue, Angular hoặc Blazor cần diagram editor tương tác.
• Giao diện kéo thả node với NodeListView cho các mô hình tùy biến.

Đối tượng sử dụng phù hợp

• Lập trình viên JavaScript xây dựng diagram editor trên web
• Nhóm phát triển React, Vue, Angular cần component vẽ sơ đồ
• Lập trình viên.NET và Blazor muốn thao tác diagram từ C#
• Tech lead cần thư viện có API chi tiết, layout tự động và TypeScript support

Thông tin kỹ thuật