Echarts ?
關於 Echarts 請移步這裡
force 力導圖
實現方式，如：
<code>function require_EC () {
require(
[
'echarts',
//载入force模块
'echarts/chart/kforce'
],
function (ec) {
//确定需要绘制的DOM
setChats(ec);
}
)
}
function setChats (ec) {
var myChart = ec.init(document.getElementById('main'));
myChart.setOption(option);
}</code>資料來源說明
主要三個資料來源： categories （資料分類）、 nodes （圖表中的節點名稱）、 links （圖表中節點之間的連結線），具體如下圖：
API開發
力導向圖資料 API文件 (個人意見僅供參考)
| 實現功能 | 1、categories、nodes、links、陣列按需加載，減輕伺服器壓力； 2、對展示孤島連結的最佳化 3、cache data 應用 |
| 介面傳遞的主要參數以及主要值 | name、force、categories、nodes、links、cache、refresh |
| 返回碼 | 見 返回碼附件圖 |
參數說明：
請求範例：（詳情看圖）
| 範例 連結 | 回傳值 | 含義 |
| force-api.php?name=demo1&force=nodes | 圖片詳情 | 獲取了 名稱為 ”demo1“的力導向圖表的 nodes（節點） 數據 |
| force-api.php?name=demo1&force=categories | 圖片詳情 | 取得了 名稱為 」demo1「的力導向圖表的 categories（分類） 數據，【以此類推 links 不做舉例】 |
| force-api.php?name=demo1_isolated_all&force=links | 圖片詳情 | 【如何取得 孤島連結？ 】將 孤島連結組成的圖表 當成一張新的圖表 即可：如圖， 取得了 demo1的所有孤島連結（demo1_isolated_all）的 links 陣列 |
| force-api.php?name=demo1_isolated_all&force=nodes&cache=refresh | 圖片詳情 | 取得了 demo1的所有孤島連結（demo1_isolated_all）的 node 陣列 並做了 強制刷新 |
註：第一次請求伺服器，如果請求正確回傳碼將是
<code>code: "2200",message: "nodes success",</code>
第二次請求伺服器 將會回傳
<code>code: "3304",message: "cache:2015-01-19 15:14:43",</code>
除非加上參數 cache=refresh 快取時間3天
返回碼約定
完
附上此次 API 介面原始碼php （php隨便寫了下，輕拍…）：下載
以上就介紹了ECharts之force力導向佈局圖－資料來源說明及後端API約定，包含了方面的內容，希望對PHP教學有興趣的朋友有所幫助。
