題:
JavaScript / HTML5網絡拓撲拖放
Jake Z
2015-04-01 23:44:05 UTC
view on stackexchange narkive permalink

我目前正在開發基於Django / Python的應用程序,該應用程序使用戶能夠使用畫布來拖放基於計算機網絡的圖像(例如路由器,交換機等)。本質上,我想構建諸如draw.io之類的東西,但允許用戶提出這樣的最終產品: http://www.conceptdraw.com/samples/resource/images/solutions/network-diagram/反過來,我想使用我開發的自定義API將他們設計的網絡拓撲轉換為真實的工作虛擬環境。木偶,Xen等。)

我正在尋找最好的圖書館來進行繪圖。 JavaScript庫太多了,但是我不確定哪個是最適合(最簡單)的任務。

理想情況下,左側窗格將具有供用戶拖動到的不同網絡工具。一些畫布(例如路由器,PC)。然後他們可以將它們彼此連接,等等。我不關心使用API​​進行這項工作...我可以弄清楚。但是我真正需要建議的就是構建這種工具的合適庫!

您的專業建議非常有價值。如果您需要更多詳細信息,請告訴我。

謝謝。

一 回答:
Davis Jebaraj
2015-05-12 19:16:44 UTC
view on stackexchange narkive permalink

JavaScript的基本圖支持創建任何類型的圖,包括網絡圖。這是一個示例

創建的圖可以進行序列化和解釋,以創建您所描述的真實實體。

整個產品可免費獲得。通過社區許可證

screenshot

-Davis(Syncfusion)

戴維斯,太棒了。謝謝!不過只是一個問題。我在社區版中找不到包含這些圖像(計算機,防火牆等)的代碼示例。你從哪裡得到的?
@JakeZ示例中的定制調色板項是使用SVG路徑創建的,它們包含在JSFiddle本身中。您可以創建任何路徑並將其添加為調色板項。如果您需要創建其他項目的幫助,請提交支持請求。
@DavisJebaraj-謝謝您。我有與原始問題類似的要求。我想在流星應用程序中實現這一點。您能否提供有關“ *可以對創建的圖進行序列化和解釋以創建真實實體*”的更多詳細信息?
@blueren [示例](http://jsplayground.syncfusion.com/4ehoxght)用於保存和加載圖。您能否在Syncfusion.com上提交票證以獲取更多幫助,因為此處的評論數量有限。
會做@DavisJebaraj。謝謝。


該問答將自動從英語翻譯而來。原始內容可在stackexchange上找到,我們感謝它分發的cc by-sa 3.0許可。
Loading...