配置项如下
var option = {
color: ['#23cbe5','Violet','#ec561b'],
legend: {
itemWidth: 25,
left: 'center',
selectedMode:false, //控制鼠标滑过事件
data: ['60分以下', '60-80分', '80-100分']
},
grid: {
left: '10%',
bottom: '2%',
top: '30',
height: '80%',
width: '89%'
},
xAxis: {
type: 'category',
data: ['2019年', '2018年', '2017年', '2016年', '2015年'],
axisLine: { // 坐标轴线
show: true, // 默认显示,属性show控制显示与否
/* lineStyle: { // 属性lineStyle控制线条样式
color: '#48b',
width: 2,
type: 'solid'
} */
},
splitLine: { // 分隔线
show: true, // 默认显示,属性show控制显示与否
// onGap: null,
lineStyle: { // 属性lineStyle(详见lineStyle)控制线条样式
color: ['#ccc'],
width: 1,
type: 'solid'
}
}
},
yAxis: {
type: 'category',
data: ['元江', '新平', '峨山','澄江', '通海','华宁', '江川', '红塔','易门'],
axisLine: { // 坐标轴线
show: true, // 默认显示,属性show控制显示与否
/* lineStyle: { // 属性lineStyle控制线条样式
color: '#48b',
width: 2,
type: 'solid'
} */
},
splitLine: { // 分隔线
show: true, // 默认显示,属性show控制显示与否
// onGap: null,
lineStyle: { // 属性lineStyle(详见lineStyle)控制线条样式
color: ['#ccc'],
width: 1,
type: 'solid'
}
}
},
series: [
{
name: '60分以下',
type: 'scatter',
data: [
["2019年",'峨山'],
["2019年",'江川'],
["2018年",'元江'],
["2018年",'华宁'],
["2015年",'澄江'],
["2015年",'通海'],
["2015年",'红塔'],
["2015年",'易门']
],
symbolSize:12
}, {
name: '60-80分',
type: 'scatter',
data: [
["2019年",'元江'],
["2019年",'通海'],
["2019年",'华宁'],
["2019年",'易门'],
["2018年",'峨山'],
["2018年",'江川'],
["2017年",'峨山'],
["2017年",'澄江'],
["2017年",'通海'],
["2017年",'江川'],
["2017年", '红塔'],
["2017年",'易门'],
["2016年",'新平'],
["2016年",'澄江'],
["2016年",'通海'],
["2016年",'华宁'],
["2016年",'红塔'],
["2016年",'易门'],
["2015年",'新平'],
["2015年",'峨山'],
["2015年",'江川']
],
symbolSize:16
}, {
name: '80-100分',
type: 'scatter',
data: [
["2019年",'新平'],
["2019年",'澄江'],
["2019年",'红塔'],
["2018年",'新平'],
["2018年",'澄江'],
["2018年",'通海'],
["2018年",'易门'],
["2018年",'红塔'],
["2017年",'元江'],
["2017年",'新平'],
["2017年",'华宁'],
["2016年",'元江'],
["2016年",'峨山'],
["2016年",'江川'],
["2015年",'元江'],
["2015年",'华宁']
],
symbolSize:20
}
]
};