在移动端,用户习惯向下滑动屏幕,所以在画柱状图的时候,可以把分类category
放到横坐标上,用纵坐标表示值value
.
"xAxis": [
{
"name":"xxxxA",
"max":"400",
"type": "value"},
{
"name":"xxxxB",
"type": "value"
}
],
此处 xAxis
是一个数组,当横坐标数量小于等于2的时候,默认显示下上两个坐标轴,如果大于2,则可以指定位置,并使用 offset 参数修正位置,不重叠
"xAxis": [
{
"name":"xxxxA",
"max":"400",
"type": "value"},
{
"name":"xxxxB",
"type": "value"
},
{
"name":"xxxxC",
"type": "value",
"position":"top"
"offset":30,
}
],
最后在series
中设置xAxisIndex
为xaxis
的index
就可以了
"series": [
{
"name":"学程数",
"type":"line",
"xAxisIndex": 1,
"data":[1,2,4,5, 8, 9.0, 8,6,5,9]
},
{
"name":"总题数",
"type":"bar",
"data":[20,10,20, 49, 70, 180,70,88,93,72]
},
{
"name":"错题数",
"type":"bar",
"data":[5, 9, 9,8,24,9,11,32,13,21]
}
]