前言

隨著網路不斷進步，網路管理的需求也越來越大，如何能讓使用者輕鬆、簡單且直觀的了解所管理的網路設備、線路、服務的運作狀況，以及當有狀況發生時能清楚快速的發現問題所在，是非常值得探討的重要問題。

如果要利用純文字來清楚表達整個網路的架構及網路架構的狀態，讓使用者能一目了然的了解自己所關心的設備線路以及服務狀態，是非常困難的。因此利用圖示來顯示整個網路架構，且讓使用者能在圖上依據自己的想法做動作、來管理網路將是一個不錯的方式，而JUNG和Piccolo就是兩個Graph Framework能讓我們來開發圖形介面的網管軟體，當然JUNG和Piccolo能運用的地方不只是開發網管軟體上而已。

JUNG 和Piccolo簡介

JUNG和Piccolo能將資料經過模組化、分析然後形象化成圖，當然包含網路拓墣圖。它們提供了相當多的software library 讓我們能做出有結構性的圖而不用考慮許多比較低階的細節問題，不論是有向圖、無向圖、有平行兩條邊的圖都提供了相當多的模組。在圖的控制方面，不論是單點及多點可以對圖上的點做選取或是移動的動作、對圖能做zoom in/zoom out和layout的動作等，我們還能在其上寫更多的程式或是模組以達到更多的控制效果，比如說將被選取的點變換顏色和圖型、自己實作自己的layout演算法等，是個非常好用的工具，不過雖然兩套Framework都能做出上述的圖和做上述的操作，但是也都有其各自的優點和缺點。

一、JUNG

JUNG為java開發完成的Framework，目前還繼續在開發和改版中，經過多次改版後其物件化和模組化可以說相當的透徹，在程式撰寫的方便性上大大提升，但是相對的在某些方面，就初學者來講寫起來較不直觀，以下舉例說明。

JUNG也有提供g.addVertex( )方法讓你能新增點，但是除非有特殊需求不然利用g.addEdge( )這個方法就可以新增點和線了，上例中g.addEdge(new MyLink( ),n1,n2,EdgeType.DIRECTED)，參數一填入"邊"物件，例子中為建立一個自訂的邊物件，你可以在此自訂的物件裡根據需求定義想要的邊要有哪些屬性和方法，此時邊的名稱會為物件內toString( )此方法的回應值，如無其他需求也可以填入數字，此時邊的名稱會為此數字，參數二和三為此邊的兩個端點，也可定義自己的點"物件"或是填入數字，參數四為定義邊的類型(可不填)，其特色為可以自訂邊和點的物件。

在JUNG中，點和線有其預設的屬性，當想要改變它時，必須利用其定義好的method來做更改，大多都是利用Transformer。

如點預設為紅色的小圓，當我們想要讓它變成綠色的小圓，我們會利用vv.getRenderContext().setVertexFillPaintTransformer(vertexPaint)來轉換而vertexPaint為一個Transformer物件，如下定義:



如點預設為紅色的小圓，當我們想要讓它變成自己想要的圖案時，我們則必須建立一個點和icon的map然後利用DefaultVertexIconTransformer來轉換，如下。



二、Piccolo

Piccolo除了有Java版本之外，也提供了C#的版本。Piccolo為利用圖層一層層的往上加來顯示出整個完整的圖來，相對於JUNG，在點跟線方面則是定義了許多自己的類別，線的PPath、點的PNode、若點為圖檔則宣告為PImage等，點的型態也在宣告時期就定義完畢，不像JUNG是事後轉換，如點為圖檔直接宣告成PImage、點的形狀則於宣告點時定義，例:PPath.createEllipse(0, 0, 100, 100)、PPath.createRectangle(0, 100, 100, 100)，定義起來相當的直觀，圖上的點想要利用多個物件組成也相當方便，如想把兩個圖當成一個點等，下面利用例子簡介一下Piccolo如何建立點、邊和其之間的關係。



上面為建立點的例子，PPath node = PPath.createEllipse(x, y, 20, 20)為建立一個橢圓形的點於位置(x,y)，長與寬為(20.20)，node.addAttribute("edges", new ArrayList())為告訴node有一個名為edges的屬性，nodeLayer.addChild(node)為把node加入node層。



上面為建立邊的例子，PNode node1 = nodeLayer.getChild(x)先定出哪兩個點為這個邊的兩端點，((ArrayList)node1.getAttribute("edges")).add(edge)將此邊加入這兩點的edge屬性中，edge.addAttribute("nodes", new ArrayList())為告訴edge有一個名為nodes的屬性，((ArrayList)edge.getAttribute("nodes")).add(node1)將兩端點加入自己的nodes屬性裡，edgeLayer.addChild(edge)為將此邊加入edge層裡。



而點與邊的關係由建立attribute的方式可以清楚被定義，只需利用下面的程式即可畫出關係來，先抓出兩端點的點座標，再利用edge.moveTo( )和edge.lineTo( )畫出線來。



在Piccolo中利用attribute可以實現類似自訂類別的運作，就此實作出許多的功能。

結論

對於網路拓墣圖方面，JUNG和Piccolo提供了一個很好的base，在此base之上，可以做出更多相關的功能和模組使其更完整和更符合個人需求，也期待JUNG和Piccolo能繼續提供新版的程式來讓使用者更方便處理需求。

參考資料

http://www.cs.umd.edu/hcil/piccolo/index.shtml
http://jung.sourceforge.net/index.html