You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何让Ant Design环形图内标签停止旋转并与X轴平行

解决Ant Design环形图内标签旋转问题

要让环形图的内部标签保持与X轴平行,只需在label配置中添加autoRotate: false即可——该属性默认值为true,会随扇区角度自动旋转标签,关闭后标签将保持水平状态。

修改后的完整配置代码如下:

const config = {
    legend: { position: labelPosition },
    appendPadding: 10,
    data,
    angleField: "value",
    colorField: "type",
    color: colors,
    radius: 1,
    innerRadius: 0.6,
    label: {
        type: "inner",
        offset: "-50%",
        content: "{value}",
        autoRotate: false, // 添加此行关闭标签自动旋转
        style: {
            textAlign: "center",
            fontSize: 14,
        },
    },
    statistic: {
        content: {
            style: {
                whiteSpace: "pre-wrap",
                overflow: "hidden",
                textOverflow: "ellipsis",
                color: "#342d31",
            },
            content: content,
        },
    },
};

内容的提问来源于stack exchange,提问作者Abhilash Madi

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.13 00:52:31