当把平行坐标系的示例中的日期轴修改为'category'类型后,“等级”轴出现无法选择区间的现象。试了一个多个'category'类型轴,只有第1个'category'轴可以选择,其它的无法选择区间。可能是系统的Bug
配置项如下
//Begin:option ============================================
// Schema:
// date,AQIindex,PM2.5,PM10,CO,NO2,SO2
var dataBJ = [
["周一",55,9,56,0.46,18,6,"良"],
["周二",25,11,21,0.65,34,9,"优"],
["周三",56,7,63,0.3,14,5,"良"],
["周四",33,7,29,0.33,16,6,"优"],
["周五",42,24,44,0.76,40,16,"优"],
["周六",82,58,90,1.77,68,33,"良"],
["周日",74,49,77,1.46,48,27,"良"]
];
var dataGZ = [
["周一",26,37,27,1.163,27,13,"优"],
["周二",85,62,71,1.195,60,8,"良"],
["周三",78,38,74,1.363,37,7,"良"],
["周四",21,21,36,0.634,40,9,"优"],
["周五",41,42,46,0.915,81,13,"优"],
["周六",56,52,69,1.067,92,16,"良"],
["周日",64,30,28,0.924,51,2,"良"]
];
var dataSH = [
["周一",91,45,125,0.82,34,23,"良"],
["周二",65,27,78,0.86,45,29,"良"],
["周三",83,60,84,1.09,73,27,"良"],
["周四",109,81,121,1.28,68,51,"轻度污染"],
["周五",106,77,114,1.07,55,51,"轻度污染"],
["周六",109,81,121,1.28,68,51,"轻度污染"],
["周日",106,77,114,1.07,55,51,"轻度污染"]
];
var schema = [
{name: 'date', index: 0, text: '日期'},
{name: 'AQIindex', index: 1, text: 'AQI'},
{name: 'PM25', index: 2, text: 'PM2.5'},
{name: 'PM10', index: 3, text: 'PM10'},
{name: 'CO', index: 4, text: ' CO'},
{name: 'NO2', index: 5, text: 'NO2'},
{name: 'SO2', index: 6, text: 'SO2'},
{name: '等级', index: 7, text: '等级'}
];
var lineStyle = {
normal: {
width: 1,
opacity: 0.5
}
};
option = {
backgroundColor: '#333',
legend: {
bottom: 30,
data: ['北京', '上海', '广州'],
itemGap: 20,
textStyle: {
color: '#fff',
fontSize: 14
}
},
tooltip: {
padding: 10,
backgroundColor: '#222',
borderColor: '#777',
borderWidth: 1,
formatter: function (obj) {
var value = obj[0].value;
return '<div style="border-bottom: 1px solid rgba(255,255,255,.3); font-size: 18px;padding-bottom: 7px;margin-bottom: 7px">'
+ obj[0].seriesName + ' ' + value[0] + '日期:'
+ value[7]
+ '</div>'
+ schema[1].text + ':' + value[1] + '<br>'
+ schema[2].text + ':' + value[2] + '<br>'
+ schema[3].text + ':' + value[3] + '<br>'
+ schema[4].text + ':' + value[4] + '<br>'
+ schema[5].text + ':' + value[5] + '<br>'
+ schema[6].text + ':' + value[6] + '<br>';
}
},
//dataZoom: {
// show: true,
// orient: 'vertical',
// parallelAxisIndex: [0]
// },
parallelAxis: [
{dim: 0, name: schema[0].text, inverse: true, type: 'category', nameLocation: 'start', data: ["周一","周二","周三","周四","周五","周六","周日"]},
{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', data: ['优', '良', '轻度污染', '中度污染', '重度污染', '严重污染']}
],
visualMap: {
show: true,
min: 0,
max: 150,
dimension: 2,
inRange: {
color: ['#d94e5d','#eac736','#50a3ba'].reverse(),
// colorAlpha: [0, 1]
}
},
parallel: {
left: '10%',
right: '18%',
bottom: 80,
parallelAxisDefault: {
type: 'value',
name: 'AQI指数',
nameLocation: 'end',
nameGap: 20,
nameTextStyle: {
color: '#fff',
fontSize: 12
},
axisLine: {
lineStyle: {
color: '#aaa'
}
},
axisTick: {
lineStyle: {
color: '#777'
}
},
splitLine: {
show: false
},
axisLabel: {
textStyle: {
color: '#fff'
}
}
}
},
series: [
{
name: '北京',
type: 'parallel',
lineStyle: lineStyle,
data: dataBJ
},
{
name: '上海',
type: 'parallel',
lineStyle: lineStyle,
data: dataSH
},
{
name: '广州',
type: 'parallel',
lineStyle: lineStyle,
data: dataGZ
}
]
};
//End:option============================================