建站
咨詢
售后
建站咨詢
新聞中心
parallel
在 ECharts 中平行坐標(biāo)系（parallel）是一種常用的可視化高維數(shù)據(jù)的圖表。平行坐標(biāo)系的具有良好的數(shù)學(xué)基礎(chǔ)， 其射影幾何解釋和對偶特性使它很適合用于可視化數(shù)據(jù)分析。
創(chuàng)新互聯(lián)建站堅持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：做網(wǎng)站、網(wǎng)站設(shè)計、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時代的弋陽網(wǎng)站設(shè)計、移動媒體設(shè)計的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！
例如 series-parallel.data 中有如下數(shù)據(jù)：
[ [1, 55, 9, 56, 0.46, 18, 6, '良'], [2, 25, 11, 21, 0.65, 34, 9, '優(yōu)'], [3, 56, 7, 63, 0.3, 14, 5, '良'], [4, 33, 7, 29, 0.33, 16, 6, '優(yōu)'], { // 數(shù)據(jù)項也可以是 Object，從而里面能含有對線條的特殊設(shè)置。 value: [5, 42, 24, 44, 0.76, 40, 16, '優(yōu)'] lineStyle: {...},} ... ]
數(shù)據(jù)中，每一行是一個『數(shù)據(jù)項』，每一列屬于一個『維度』。（例如上面數(shù)據(jù)每一列的含義分別是：『日期』,『AQI指數(shù)』, 『PM2.5』, 『PM10』, 『一氧化碳值』, 『二氧化氮值』, 『二氧化硫值』）。
平行坐標(biāo)系適用于對這種多維數(shù)據(jù)進(jìn)行可視化分析。每一個維度（每一列）對應(yīng)一個坐標(biāo)軸，每一個『數(shù)據(jù)項』是一條線，貫穿多個坐標(biāo)軸。在坐標(biāo)軸上，可以進(jìn)行數(shù)據(jù)選取等操作。如下：
點(diǎn)擊編輯實例 》》
平行坐標(biāo)系配置方式
『平行坐標(biāo)系』的 option 基本配置如下例：
option = {
parallelAxis: [ // 這是一個個『坐標(biāo)軸』的定義
{dim: 0, name: schema[0].text}, // 每個『坐標(biāo)軸』有個 'dim' 屬性，表示坐標(biāo)軸的維度號。
{dim: 1, name: schema[1].text},
{dim: 2, name: schema[2].text},
{dim: 3, name: schema[3].text},
{dim: 4, name: schema[4].text},
{dim: 5, name: schema[5].text},
{dim: 6, name: schema[6].text},
{dim: 7, name: schema[7].text,
type: 'category', // 坐標(biāo)軸也可以支持類別型數(shù)據(jù)
data: ['優(yōu)', '良', '輕度污染', '中度污染', '重度污染', '嚴(yán)重污染']
}
],
parallel: { // 這是『坐標(biāo)系』的定義
left: '5%', // 平行坐標(biāo)系的位置設(shè)置
right: '13%',
bottom: '10%',
top: '20%',
parallelAxisDefault: { // 『坐標(biāo)軸』的公有屬性可以配置在這里避免重復(fù)書寫
type: 'value',
nameLocation: 'end',
nameGap: 20
}
},
series: [ // 這里三個系列共用一個平行坐標(biāo)系
{
name: '北京',
type: 'parallel', // 這個系列類型是 'parallel'
data: [
[1, 55, 9, 56, 0.46, 18, 6, '良'],
[2, 25, 11, 21, 0.65, 34, 9, '優(yōu)'],
...
]
},
{
name: '上海',
type: 'parallel',
data: [
[3, 56, 7, 63, 0.3, 14, 5, '良'],
[4, 33, 7, 29, 0.33, 16, 6, '優(yōu)'],
...
]
},
{
name: '廣州',
type: 'parallel',
data: [
[4, 33, 7, 29, 0.33, 16, 6, '優(yōu)'],
[5, 42, 24, 44, 0.76, 40, 16, '優(yōu)'],
...
]
}
]
};需要涉及到三個組件：parallel、parallelAxis、series-parallel
- parallel：這個配置項是平行坐標(biāo)系的『坐標(biāo)系』本身。一個系列（series）或多個系列（如上圖中的『北京』、『上?！?、『廣州』分別各是一個系列）可以共用這個『坐標(biāo)系』。和其他坐標(biāo)系一樣，坐標(biāo)系也可以創(chuàng)建多個。位置設(shè)置，也是放在這里進(jìn)行。
- parallelAxis：這個是『坐標(biāo)系』中的坐標(biāo)軸的配置。自然，需要有多個坐標(biāo)軸。其中有 parallelAxis.parallelIndex 屬性，指定這個『坐標(biāo)軸』在哪個『坐標(biāo)系』中。默認(rèn)使用第一個『坐標(biāo)系』。
- series-parallel：這個是『系列』的定義。系列被畫到『坐標(biāo)系』上。其中有 series-parallel.parallelIndex 屬性，指定使用哪個『坐標(biāo)系』。默認(rèn)使用第一個『坐標(biāo)系』。
平行坐標(biāo)系配置注意項及實例
配置多個 parallelAxis 時，有些值一樣的屬性，如果書寫多遍則比較繁瑣，那么可以放置在 parallel.parallelAxisDefault 里。在坐標(biāo)軸初始化前，parallel.parallelAxisDefault 里的配置項，會分別融合進(jìn) parallelAxis，形成最終的坐標(biāo)軸的配置。
如果數(shù)據(jù)量很大并且發(fā)生卡頓的話，建議把 series-parallel.lineStyle.normal.width 設(shè)為 0.5（或更?。?， 可能顯著改善性能。
遇到維度較多的數(shù)據(jù)的顯示時，比如有 50+ 的維度，那么就會有 50+ 個軸。那么可能會頁面顯示不下。
那么，可以通過 parallel.axisExpandable 來改善顯示效果，如下例子：
點(diǎn)擊編輯實例 》》
本文標(biāo)題：創(chuàng)新互聯(lián)ECharts教程：ECharts平行坐標(biāo)系（parallel）
本文來源：http://www.5511xx.com/article/dpgspoc.html
