使用echarts前需要先引用echarts
echarts快速上手
option = {
xAxis: {
type: 'category',
data: ['月考一', '月考二', '月考三', '月考四', '月考五', '月考六'],
position:'bottom',//坐标轴的位置
name:"考试名称",
nameLocation:'end',
nameTextStyle:{
color:'#333333'
},
axisTick:{
show:false
},
axisLabel: {
show: true,
textStyle: {
color: '#333333', //更改坐标轴文字颜色
fontSize : 14 //更改坐标轴文字大小
},
interval:0,
rotate:10
},
axisLine:{
lineStyle:{
color:'#CCCCCC' //更改坐标轴颜色
}
}
},
yAxis: {
type: 'value',
inverse:true,
name:"名次",
nameLocation:'start',
nameTextStyle:{
color:'#333333'
},
scale:true,//y轴开口向下
min:1,//y轴最小值
axisTick:{
show:false
},
axisLabel: {
show: true,
textStyle: {
color: '#333333', //更改坐标轴文字颜色
fontSize : 14 //更改坐标轴文字大小
}
},
axisLine:{
lineStyle:{
color:'#CCCCCC' //更改坐标轴颜色
}
}
},
series: [{
data: [ 4 ,5, 8, 12, 3, 6],
type: 'line',
//设置平均名称标线
// markLine:{
// data:[
// {type: 'average', name: '平均值'},
// ],
// symbol:'none',//去掉箭头
// label:{
// },
// lineStyle: {
// normal: {
// type: 'solid',
// color: '#333333',
// },
// },
// }
}]
};