option = {
xAxis: {
type: 'category',
// position:'top',//坐标轴的位置
data: [{value:'1',textStyle:{
color:'#ff0033',
}}, '2/7', '3', '4', '5', '6', '7']//每一项也可以是具体的配置项,此时取配置项中的 `value` 为类目名
},
yAxis: {
type: 'value',
name:'每日交易量',//坐标轴名称
nameLocation:'middle',//坐标轴的位置
nameTextStyle:{
color:'#ff0033',
//align:'left',
},
nameGap:50,//坐标轴名称与轴线之间的距离
nameRotate:90,//坐标轴名字旋转角度值,
axisLine:{
lineStyle:{
color:'#ff0000'
},
symbol:['none', 'arrow'],//轴线两边的箭头
symbolSize:[8, 12]
},
axisTick:{
inside:false,//标轴刻度是否朝内,默认朝外
},
axisLabel:{
show:true,
inside:false,
formatter: '{value} kg'
},
splitArea:{
show:true,
color:['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)'],
}
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'bar'
}]
};
Echarts参数属性学习xAxis与yAxis演示案例
原创
©著作权归作者所有:来自51CTO博客作者漏刻有时的原创作品,请联系作者获取转载授权,否则将追究法律责任
提问和评论都可以,用心的回复会被更多人看到
评论
发布评论
相关文章
-
echarts双y轴,YAxis配置,以及多个y轴和数据之间对应的关系
echarts双y轴,YAxis配置,以及多个y轴和数据之间对应的关系
echarts 前端 javascript 坐标轴 ci -
Echarts数据可视化grid直角坐标系(xAxis、yAxis),开发全解+完美注释
mytextStyle={ color:"#333",//文字颜色 fontStyle:"normal",//italic斜体 oblique倾斜
数据可视化 Echarts grid xAxis yAxis