圖數據交互可視化分析框架 InteractiveGraph
日前發佈v0.3版本,下載地址:https://github.com/grapheco/InteractiveGraph/releases/tag/0.3.1
項目開源託管地址:https://github.com/grapheco/InteractiveGraph(歡迎star!)
圖數據模型具有對實體關係的表達能力強、屬性 及結構可擴展性好、關聯查詢高效等優勢。在對海量 的多元異構信息進行建模時, 圖數據模型較關係模 型、鍵值模型、文檔模型等而言具有更好的直觀效果, 更有利於使用者對數據結構和語義關係的理解。此外, 圖數據模型還具有可推理、可深度挖掘的特點, 因此 在智能問答、金融風險預測等方面也得到較爲廣泛的應用。
爲屏蔽不同圖數據管理系統、數據模型和協議之間的差異, 簡化圖數據交互分析操作的複雜度並提高上層服務應用的通用性, 我們在分析現有圖數據存儲管理系統、查詢協議和可視化分析工具的基礎上, 構建了適合多元異構圖數據管理系統的交互分析框架InteractiveGraph
。
InteractiveGraph
是一個使用TypeScript/JavaScript開發的開源項目,爲大規模圖數據提供了一個基於Web的交互操作框架,其數據可以來自於本地的GSON
文件。
InteractiveGraph提供了3個基本應用,分別是圖導航器(GraphNavigator
),圖瀏覽器(GraphExplorer
)以及關係查找器(RelFinder
)。藉助這些應用,可以方便地實現圖數據的可視化展示和相關操作。
圖導航器(GraphNavigator):快速展示整個圖中的節點和邊,便於瀏覽整張圖,點擊某個節點可以查看此節點下存儲的描述信息。導航器中還包括對應用外觀的多種設置,包括但不僅限於,顯示導航按鈕,調整主題顏色。
圖導航器在線Demo地址:https://grapheco.github.io/InteractiveGraph/dist/examples/example1.html
圖瀏覽器(GraphExplorer):快速瀏覽某個節點的相關信息,支持搜索節點。單擊節點顯示其詳細描述信息,雙擊節點顯示其所有鄰居節點和連邊。
圖瀏覽器在線Demo地址:https://grapheco.github.io/InteractiveGraph/dist/examples/example2.html
關係查找器(RelFinder):用於查找兩個節點之間的關係。支持對起點、終點,以及關係深度的限定。將會返回起點和終點之間所有深度不大於限定值的全部關係以及中間節點。
關係查找器在線Demo地址:https://grapheco.github.io/InteractiveGraph/dist/examples/example3.html
快速開始(Quick Start)
Step 1. 下載 examples.zip
,鏈接如下:
https://github.com/grapheco/InteractiveGraph/releases
Step 2. 解壓examples.zip
,並將其部署在Web服務器上(比如Tomcat)。 如果不使用Web服務器,通過AJAX讀取數據時將會出錯。
Step 3. 在瀏覽器中打開示例,url如下:
https://localhost:8080/examples/example1.html
把 example1.html
改爲 example2.html
或 example3.html
, 等,即可試用三個不同應用。
使用方法(How to use)
Step 1. 下載 interactive-graph-<VERSION>.zip
(如interactive-graph-0.1.0.zip
) :
https://github.com/grapheco/InteractiveGraph/dist/
Step 2. 解壓 interactive-graph-<VERSION>.zip
, 將得到兩個文件: interactive-graph.min.js
和 interactive-graph.min.css
.
Step 3. 在HTML中引入 .js
和 .css
文件,比如:
<script type="text/javascript" src="./lib/interactive-graph-0.1.0/interactive-graph.min.js"></script>
<link type="text/css" rel="stylesheet" href="./lib/interactive-graph-0.1.0/interactive-graph.min.css">
Step 4. 使用在 igraph
中定義的函數和類:
<script type="text/javascript">
igraph.i18n.setLanguage("chs");
var app = new igraph.GraphNavigator(document.getElementById('graphArea'));
app.loadGson("honglou.json");
</script>
按上述步驟操作,將會使用honglou.json
中的數據創建一個 GraphNavigator
應用對象。
更多詳細信息, 請參見 https://github.com/grapheco/InteractiveGraph/blob/master/dist/examples/example1.html.
如若需要擴展應用,可以根據GraphNavigator
或其他應用寫衍生類,也可以通過使用 MainFrame
直接創建新的應用.
框架
InteractiveGraph框架涉及3個部分,如下圖所示。
其中服務接口列表如下:
InteractiveGraph框架的軟件層次如下圖所示:
主要包括如下內容:
(1) 數據層: 提供圖數據的存儲和查詢服務, 該層包含異構的數據管理系統, 如: Neo4j、Titan、Jena 等。
(2) 服務協調層: 通過適配器適配不同的數據源, 管理離線查詢和數據分析任務, 同時支持通過圖算法對映射後得到的數據進行處理和挖掘。
(3) 應用協調層: 提供一個支持可視化分析應用的框架AppFrame, 其中包括兩個用於指定可視化應 用數據源的數據連接器, 消息機制、緩衝機制、控件 管理等組件。AppFrame 可以爲可視化分析應用提供指定數據源、緩衝數據等服務, 簡化應用結構, 統一應用 接口。
(4) 應用層: 面向最終用戶提供交互分析應用。
數據集(Datasets)
示例中以.json
文件的形式提供了兩個GSON數據集:honglou.json, WorldCup2014.json.
honglou.json
honglou.json數據集來自於中國古典名著《紅樓夢》。
在這部小說中賈寶玉、林黛玉、薛寶釵是主要人物。這個數據集中定義了超過300個實體,其中包括書中的人物,地點和時間,以及超過500個這些實體之間的連接。
nickel2008@github 提供了該數據集。此數據集中或有紕漏,但是對於一個圖數據項目的示例來說已經足夠好了。
WorldCup2014.json
World Cup 2014數據集來自http://visjs.org/examples/network/exampleApplications/worldCupPerformance.html
其中邊較多,因此繪製時對算力要求較高。
下邊的屏幕截圖展示了在GraphNavigator
中,WorldCup2014.json是如何渲染的。
Building an IGP server
An RemoteGraph
is always provided by an IGP(interactive graph protocol, see https://github.com/grapheco/InteractiveGraph/blob/master/IGP.md) server. To build an IGP server, refer to the InteractiveGraph-neo4j project and other 3-party projects.
project | description | language |
---|---|---|
InteractiveGraph-neo4j | InteractiveGraph-neo4j(https://github.com/grapheco/InteractiveGraph-neo4j) serves GSON files, Neo4j databases as InteractiveGraph providers, it generates InteractiveGraphs for remote frontend InteractiveGraph clients on demand. | Scala+Java+Spring |
InteractiveGraph-RDF | InteractiveGraph-RDF(https://github.com/grapheco/InteractiveGraph-RDF) serves RDF stores as InteractiveGraph providers | Scala+Java+Spring |
證書(LICENSE)
InteractiveGraph 使用 BSD 2-Clause "Simplified"證書。
在開發InteractiveGraph時,依賴了一些開源項目,包括但不僅限於visjs
, npm
, gulp
, jQuery
, jQueryUI
, Font Awesome
。
相關參考
關於項目依賴的詳情,請參見 https://github.com/grapheco/InteractiveGraph/blob/master/package.json.
更多內容請參見Interactive的中文版自述文件:https://github.com/grapheco/InteractiveGraph/blob/master/README_CN.md
論文請參見:
趙子豪,沈志宏. 一種適合多元異構圖數據管理系統的交互分析框架[J]. 數據分析與知識發現,2019,10(34):37-46.