網絡流程圖

Question

我完全知道「SO不是要求工具的地方」，所以我進行了自己的搜索並找到了一些工具，但是由於我需要一些特定的功能，因此我相信SO用戶的綜合專業知識和經驗可能對我所尋找的東西非常有用。那就是：一個庫，能夠建立/顯示在網頁上類似於此的流程圖：

正如我提到我見過jsPlumb和其他幾個人，但它需要太多有時間去研究每個人的個人特徵，所以我希望有經驗的人可以提出最好的選擇。我要找的特點：

1. 瀏覽器支持IE8 +，Chrome瀏覽器，FF
2. 能夠添加/修改/刪除圖表項目上飛視覺或programmaticaly
3. 可以更新後端（ASP.NET/SQL服務器）與圖表數據
4. 能夠具有柔性連接器（如從按鈕3到在上面的例子中狀態1）
5. 能力來加載圖表數據和具有項自動排列成默認/最佳佈局
6. 可能的李（這是一個愚蠢的，但這是商業方面的要求，他們警惕免費產品）

我可能會得到不少的對這個問題的讚賞，但我願意偶然，希望有人能提出一個適合我需求的好流程圖庫。

Answer 1

由於您的問題很頑皮，因此mxGraph是唯一具有完整IE8支持（低至IE 6）的圖表庫。這是與全功能，試試draw.io在IE 8上。

1）是的，Opera，Safari，iOS 5 +，Android 4+，Windows 8 touch，ChromeOS。 2）是 3）我們在.NET中的服務器上有一個完整的圖模型實現，它更容易集成一個僅支持JavaScript的解決方案。 4）是 5）是 6）是

是的，我工作的產品。

Answer 2

讓我們看看如何yFiles for HTML比較：

1. 瀏覽器支持IE9 +，鉻，FF，(and more)（IE8是一個沒有去，因爲HTML-5是必需的，IE8根本不支持這一水平，既不在可視化，也不在Javascript級別）。
2. 有一個very rich API可用於以編程方式更改模型和視圖的任何方面。默認編輯功能允許所有標準編輯操作，可以輕鬆添加自定義編輯操作。
3. yFiles for HTML 1.1是純粹的客戶端應用程序，因此當前需要由程序員添加服務器連接。由於該庫與服務器無關，因此可以使用任何服務器技術 - 包中包含的樣本。
4. 靈活的連接器實際上是默認的：任何數量的彎曲和標籤都可以添加到連接器，連接器可以連接到兩個端口。這兩種類型的物品都可以進行高度配置和定製。
5. 該庫的一個突出特點是versatile automatic layout algorithms。一般來說，不可能獲得「最佳」佈局，但（啓發式的，至少大部分）算法被認爲是「最佳的」。
6. 該圖書館只是一個商業圖書館。

圖書館是否真正適合您的需求取決於很多因素。除非（1）對你有阻礙，否則我認爲yFiles可能是一個很好的候選人。您可以通過從主頁評估來嘗試。

我重新在網上編輯您的樣品，並使用了以下簡單的代碼配置來創建一個自動佈局：

var ihl = new yfiles.hierarchic.IncrementalHierarchicLayouter() 
ihl.automaticEdgeGrouping = true 
ihl.backloopRouting = true 
ihl.layoutOrientation = yfiles.layout.LayoutOrientation.LEFT_TO_RIGHT 
ihl.integratedEdgeLabeling = true 

// animate and apply the layout 
graphControl.morphLayout(ihl, yfiles.system.TimeSpan.fromSeconds(1), null) 

這是我得到：

注意 ：你沒有要求無插件解決方案，但我回答了你的問題，就像你做的一樣。如果Flash，Silverlight或Applets等插件可以接受，那麼各個平臺的兄弟yFiles產品也可能是一個選項。他們在支持這些插件的所有瀏覽器上工作，因此即使是最舊的IE版本也是受支持的。

免責聲明：我爲創建該圖書館的公司工作，但我在SO/SE不代表我的僱主。我的想法，評論和帖子都是我自己的。

Answer 3

GenMyModel現在支持流程圖表：

，您可以查看和叉這個樣本here