關聯關係前端展示

前段時間，項目中須要實現模塊關聯關係的展示，這種關係上下游的歸屬方不肯定，也就是箭頭方向不肯定，並且模塊間的關係複雜，就須要一種比較靈活的算法來實現這種佈局。

在最開始選擇了d3 force 來實現這種佈局，若是數據是呈現爲樹形結構，或者關係不復雜的時候，或者模塊不少，可是關聯關係不復雜的時候，這種展示方式仍是很美的。可是若是關聯關係複雜，就會顯得很亂，由於模塊與模塊之間的線沒法按最優的方式來顯示。若是想看d3 force 的效果或者瞭解d3 force 的用法，請參考 http://blog.segmentfault.com/joanna123/1190000000578378 這篇文章。

通過組內同窗的討論與研究，後來選擇了使用graphviz。graphviz 可以在若是模塊是樹形結構可以很好的展示成樹形結構，若是不是樹形結構，會把相同層級的模塊在一行展現。這種佈局遠遠優於d3 force 的佈局。

展示的結果如圖：

graphviz是貝爾實驗室幾個計算機牛人設計的一個開源 的圖表(計算機科學中數據結構中的圖)可視化項目，主要用C語言實現，主要實現了一些圖佈局算法。經過這些算法，能夠將圖中的節點在畫布上比較均勻的分 布，縮短節點之間的邊長，而且儘可能的減小邊的交叉。並且生成的圖是svg標籤，方面在此基礎上添加各類交互。

官網地址：http://graphviz.org/

在項目中咱們使用的是php graphviz,
下載地址：http://pear.php.net/package/Image_GraphViz/download
使用文檔：http://pear.php.net/package/Image_GraphViz/download
第一個demo: http://pear.php.net/manual/en/package.images.image-graphviz.example.php

目前php graphviz的使用我只在linux 使用成功了，Graphviz.php文件中引用了 require_once 'System.php' 這個文件，在windows下沒有安裝成功，若是哪位高手運行成功了，可告訴我。

具體的使用步驟查看：http://blog.segmentfault.com/joanna123/1190000000605923

更多細節使用查看官網文檔：http://www.graphviz.org/Documentation.php