
V4.7.0
想还原设计图里的,横向柱状图将类目名称显示在图表上方的效果(如图) 
按官方示例 Deo 改了一个,但总是没法更改 Y 轴类目名位置的问题 
option = { backgroundColor: '#071021', tooltip: { trigger: 'axis', axisPointer: { // 坐标轴指示器,坐标轴触发有效 type: 'shadow' // 默认为直线,可选为:'line' | 'shadow' } }, legend: { data: ['违法数', '事故数', '死亡数'], // right: '35%', bottom: 'bottom', itemGap: 10, padding: [16,0], itemWidth: 20, itemHeight: 10, textStyle: { fontSize: 12, fontWeight: 600, color: '#C4D3F5' } }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: { type: 'value', show: false, }, yAxis: { type: 'category', show: true, // itemStyle: { // color: '#fff' // }, data: ['西安纵横交通设施工程有限公司', '西安市双生吉福搬家服务部', '陕西明通交通设施工程有限公司', '扬力集团股份有限公司', '陕西西安路路通交通设施有限公司', '西安智达交通有限责任公司', '西安天畅交通设施有限责任公司','陕西中旺能源交通开发有限责任公司','蓝天巴士集团','西安菱力物流设备有限公司'] }, series: [ { name: '违法数', type: 'bar', stack: '总量', barGap: '-10%', barWidth: '50%', showBackground: true, backgroundStyle: { color: 'rgba(255,255,255,0.1)' }, label: { show: true, position: 'inside', // position: 'right', color: '#ffffff', fontSize: 15 }, data: [320, 302, 301, 334, 390, 330, 320,301, 334, 390], itemStyle: { color: '#0E9BD8', // normal: { // // show: true, // // position: "top", // } }, }, { name: '事故数', type: 'bar', stack: '总量', label: { show: true, position: 'inside' }, data: [120, 132, 101, 134, 90, 230, 210,120, 132, 101], itemStyle: { color: '#FEA900' }, }, { name: '死亡数', type: 'bar', stack: '总量', label: { show: true, position: 'insideRight' }, data: [220, 182, 191, 234, 290, 330, 310,220, 182, 191], itemStyle: { color: '#FF3D3D' }, }, ] }; 1 c6h6benzene 2020-11-18 11:04:39 +08:00 via iPhone 这应该是 label.position 控制的。你现在应该是把类目名当做了 Y 轴的 label 。 |