在 Ant Design Charts 的 Donut（环形图）中，默认标签会随扇区角度自动旋转，若需所有内圈标签统一水平显示（即平行于 X 轴），只需在 label 配置项中添加 autoRotate: false 即可实现。
在 ant design charts 的 donut（环形图）中，默认标签会随扇区角度自动旋转，若需所有内圈标签统一水平显示（即平行于 x 轴），只需在 `label` 配置项中添加 `autorotate: false` 即可实现。
Ant Design Charts 基于 G2Plot 构建，其 Donut 图（本质为 pie 图的变体）在渲染内圈标签（type: "inner"）时，默认启用 autoRotate: true，导致每个标签按所在扇区的中心角度倾斜排布。这种设计虽增强视觉对齐感，但在强调数据可读性或 UI 一致性（如中英文混排、固定字号排版）的场景下，往往需要强制标签保持水平。
解决方法极为简洁：显式将 label.autoRotate 设为 false。该配置会覆盖默认行为，使所有内圈标签统一以 0° 方向（即平行于 X 轴）渲染，无论其对应扇区角度如何。
以下是修正后的完整配置示例：
const config = {
legend: { position: labelPosition },
appendPadding: 10,
data,
angleField: "value",
colorField: "type",
color: colors,
radius: 1,
innerRadius: 0.6,
label: {
type: "inner",
offset: "-50%", // 向圆心偏移 50%，确保标签位于环形带中间
content: "{value}",
autoRotate: false, // ? 关键配置：禁用自动旋转
style: {
textAlign: "center",
fontSize: 14,
fill: "#333", // 推荐显式设置文字颜色，避免主题色干扰可读性
},
},
statistic: {
content: {
style: {
whiteSpace: "pre-wrap",
overflow: "hidden",
textOverflow: "ellipsis",
color: "#342d31",
},
content: content,
},
},
};⚠️ 注意事项：
- autoRotate: false 仅影响 type: "inner" 标签；外置标签（如 type: "spider" 或默认外侧标签）需结合 layout 和 rotate 单独控制；
- 若启用 statistic.content（中心统计文本），它不受 label.autoRotate 影响，其样式需独立通过 statistic.content.style 调整；
- 在多语言或长文本场景下，建议配合 maxWidth 和 ellipsis 等 style 属性优化换行与截断效果；
- 该配置自 Ant Design Charts v1.3.0+ 全面支持，低版本请升级至最新稳定版以确保兼容性。
总结而言，autoRotate: false 是控制 Donut 图内标签方向最直接、轻量且可靠的方案。无需额外计算角度或封装自定义渲染器，一行配置即可达成专业级图表排版需求。
