Echarts 柱状图隐藏显示刻度之类的
option = {
tooltip: {
trigger: 'axis', // 提示框触发类型,鼠标移动到轴上时触发显示提示框
axisPointer: {
type: 'shadow' // 坐标轴指示器类型为阴影指示器
}
},
legend: {
data: ['Income'] // 图例(图例是用来解释图表的符号和颜色的)数据,这里只有一个名称为 'Income' 的图例
},
grid: {
left: '3%', // 图表距离容器左边的距离
right: '4%', // 图表距离容器右边的距离
bottom: '3%', // 图表距离容器底部的距离
containLabel: true // grid 区域是否包含坐标轴的刻度标签,默认为 false,这里设置为 true 表示包含
},
xAxis: [
{
type: 'value', // x 轴为数值轴
show:false, // 是否显示 x 轴
}
],
yAxis: [
{
type: 'category', // y 轴为类目轴
axisTick: {
show: false // 是否显示刻度线
},
axisLabel:{
show:false // 是否显示刻度标签
},
axisLine:{show:false}, // 是否显示坐标轴轴线
splitLine:{show:false} // 是否显示分割线
}
],
series: [
{
name: 'Income', // 数据系列的名称
type: 'bar', // 柱状图
stack: 'Total', // 同类别的数据堆叠在一起
barWidth: 20, // 柱状图的宽度
label: {
show: true, // 是否显示标签
position:'right', // 标签位置在柱形的右侧
formatter: '{c}%' // 标签的内容格式,这里显示数据值并添加百分号
},
emphasis: {
focus: 'series' // 高亮显示系列
},
data: [8, 9, 12, 15, 18, 20, 22] // 数据已转换为百分比
},
]
};
