Description
Describe the bug / 问题描述
// 柱状图配置
const columnConfig = useMemo(() => {
return {
data: data,
xField: 'pageType',
yField: 'displayUVRate',
scrollbar: {
x: { ratio: 0.1, scrollable: true, wheel: true },
},
height: 400,
label: {
text: 'displayUVRate',
position: 'inside',
style: {
textAlign: 'center', // 居中显示
fill: '#fff', // 文字颜色
fontSize: 12, // 文字大小(按需调整)
fontWeight: 'bold',
},
formatter: (val: number) => {
const percentage = (val * 100).toFixed(2); // 转换为百分比并保留两位小数
return ${percentage}%
;
},
},
interactions: [{ type: 'element-active' }],
scale: {
y: {
domain: [0, 1],
},
},
axis: {
y: {
line: false,
label: false,
tick: false
},
x: {
tick: false,
labelSpacing: 10,
labelFill: '#000',
labelFillOpacity: 1
}
},
style: {
fill: '#58c5f4', // 柱子颜色(按需调整)
},
tooltip: false,
ref: columnRef,
};
}, [data])
Reproduction link / 复现链接
No response
Steps to Reproduce the Bug or Issue / 重现步骤
No response
Version / 版本
🆕 2.x
OS / 操作系统
- macOS
- Windows
- Linux
- Others / 其他
Browser / 浏览器
- Chrome
- Edge
- Firefox
- Safari (Limited support / 有限支持)
- IE (Nonsupport / 不支持)
- Others / 其他