首先因?yàn)樵趀chart3.0版本就已經(jīng)舍棄了和弦圖,所以不得不使用echarts2.0
和弦圖和餅圖類似可以使用center定位琢歇,radius控制大小,所以只要設(shè)置每個(gè)series的這兩個(gè)值就會在相應(yīng)位置畫出和弦圖遵岩。
代碼如下
option = {
series : [
{
center:["20%","50%"],
type:'chord',
sort : 'ascending',
sortSub : 'descending',
showScale : false,
nodes: [
{name:'a'},
{name:'b'},
],
links: [
{source: 'a', target: 'b', weight: 0.9},
{source: 'b', target: 'a', weight: 0.9},
]
},
{
center:["70%","50%"],
type:'chord',
sort : 'ascending',
sortSub : 'descending',
showScale : false,
nodes: [
{name:'a'},
{name:'b'},
],
links: [
{source: 'a', target: 'b', weight: 0.9},
{source: 'b', target: 'a', weight: 0.9},
]
}
]
};
效果如此:第一個(gè)series沒有被顯示意敛。
下面開始解決問題
源碼位置:echarts/src/chart/chord.js
問題1: _init方法中
問題2: _buildChords方法中
因?yàn)閱栴}一已經(jīng)將series分組成了兩個(gè)series,buildChords方法中也只考慮了series長度為1的情況立轧。最后在輸出圖表數(shù)據(jù)的時(shí)候如下圖所示seriesIndex是錯(cuò)誤的格粪。
以下為解決方案