Tương đương với JavaScript Graphviz thuần túy [đã đóng]

Có ai biết về việc triển khai dựa trên Javascript thuần túy các sơ đồ dòng định hướng mà GraphViz có khả năng tạo ra không? Tôi KHÔNG quan tâm đến đầu ra hình ảnh đẹp, nhưng các tính toán để tìm ra độ sâu tối đa của mỗi nút, cùng với cách bố trí các đường bezier được tối ưu hóa để giảm thiểu số lượng các cạnh giao nhau khi bạn xử lý biểu đồ thay vì cây của thông tin. Tôi muốn chạy mã này cả trong một trình duyệt; Tôi biết rằng tôi có thể dễ dàng nhúng Graphviz vào máy chủ Node của mình dưới dạng tiện ích mở rộng hoặc thậm chí popen()nó và truyền phát thông tin biểu đồ theo .dotđịnh dạng.

Để tham khảo, đây là một đầu ra GraphViz điển hình. Lưu ý cách các phần tử được xếp chồng lên nhau và cách nhau để cho phép các đường kết nối di chuyển giữa các nút, mà không giao nhau (rất thường xuyên) hoặc đi qua các nút.

Hãy xem triển khai JavaScript thuần túy này của trình kết xuất canvas .dot:

http://ushiroad.com/jsviz/

Thư viện không được ghi lại - tác giả chắc chắn phải công khai và ghi chép lại nhiều hơn (ít nhất là tôi sẽ liên lạc với anh ấy để đề nghị anh ấy đưa nó lên github, ít nhất là).

Cập nhật : mã đã được đẩy lên github: https://github.com/gyuque/livizjs

Cập nhật (14/2/2013) : một ứng cử viên khác đã phát sinh! Bất cứ ai quan tâm đến chủ đề này chắc chắn nên xem trang ví dụ của Viz.js và repo github .

Cập nhật (16/07/2020) : (bảy năm sau) http://webgraphviz.com/ cũng rất tuyệt! :-)

Sau khi tìm kiếm xa và cuối cùng tôi đã tìm thấy câu trả lời.

Giải pháp là ai đó đã biên dịch chéo Graphviz sang Javascript bằng cách sử dụng llvm + emscripten. Đây là đường dẫn:

http://viz-js.com/

Nguồn có thể được tìm thấy tại: https://github.com/mdaines/viz.js

Và để đơn giản sử dụng trang web:

var graphviz_text = ...;
document.body.innerHTML += Viz(graphviz_text, "svg");

Sau khi xem tất cả các tùy chọn, tôi thấy viz.js ( https://github.com/mdaines/viz.js/ ) dựa trên jsviz và graphviz.js để thực sự có API có thể sử dụng được từ một trang web và đủ ví dụ để hiểu biết.

Mọi người có thể thử chuyển đổi graphviz sang javascript, giống như nó đã được thực hiện cho ví dụ 'trình đọc PDF': https://github.com/kripken/emscripten

Đây không phải là một thay thế graphviz làm sẵn nhưng d3.js là một thư viện có thể thực hiện nhiều bố cục khác nhau từ dữ liệu đã cho và sẽ là một nền tảng tuyệt vời để triển khai graphviz.

Đây là một ví dụ về bố trí hướng lực , là một dạng của graphviz.

Đây là một bài phát biểu về bố cục với các slide tương tác cực kỳ tuyệt vời .

Để làm quen với dự án, các hướng dẫn rất tốt.

Dưới đây là một bản tổng hợp chéo của Graphviz sang Javascript được thực hiện bằng Emscripten

https://github.com/bpartridge/graphviz.js