用於連接矩形的線的算法

Question

我正在尋找用於繪製矩形之間的連接線的算法或示例解決方案。在我的情況下，矩形是元素甘特圖，連接顯示依賴關係。我正在使用Raphael JS庫來繪製矩形和線條。所以JavaScript中的解決方案將是最好的，但是元語言或其他JS類似的算法也會很好。

我找到了an example that looks nice但也許有人知道別的東西。

在我的情況下，有一些相關的要求：

1. 只有水平和垂直線被允許
2. 線不應相互交叉
3. 線不應跨矩形 我希望實現的東西與此類似：

Answer 1

看起來您正在尋找javascript甘特圖表。看看這個人的：

http://dhtmlx.com/docs/products/dhtmlxGantt/index.shtml

• 編輯圖表
• 完全控制使用JavaScript API
• 多瀏覽器/多平臺支持XML
• 序列化到XML
• 加載
• 可移動/可調整大小的活動
• 內置編輯菜單，加上定製dhtmlxMenu支持
• 擴展屬性彈出
• 可選樹視圖
• 定製任務訂閱
• 完成百分比陰影
• 依賴箭頭
• 快速和流暢的渲染
• 內置約束檢查
• 易於打印模式

http://www.bryntum.com/products/gantt/

• 完全建立在Web標準 - HTML/CSS/JavaScript的
• 使用任何服務器（PHP，Java和ASP。NET）
• 支持的依賴關係，超前/滯後和關鍵路徑
• 導出爲PDF/PNG，MS項目進口
• 項目，任務和資源日曆
• 股與午睡

http://gxt-scheduler.com/

測試

• 完全基於web標準 - HTML/CSS/GWT
• 集成與任何類型的後端
• 完全主題化，只需要基本的HTML/CSS知識
• 將&下降，容易調整項目
• 支持所有主流瀏覽器

http://gantter.com/

• 谷歌驅動器集成
• 基於雲計算的免費項目調度

http://gantt.twproject.com/

• 就地編輯
• 拖&下降
• 變焦
• 做/撤消
• 多個依賴
• 完整的編輯
• 日期小號hortcuts
• CSS皮膚
• 多個瀏覽器
• 資源編輯
• 多重分配
• 里程碑JSON格式
• 出口數據
• 調整&滾動