Reactjs 如何防止React Recharts中的轴长标签断裂？

我正在使用React Recharts（）显示一些图表数据，我需要在轴附近显示格式化的值。轴值由空格分隔，例如

1 000 000$

。React Recharts将值拆分为单独的行

---

如何防止标签断裂并在同一行完全显示？

您是否尝试过使用记号格式设置器？我试图重现你的问题，但没有成功

这是一个重新设计的图表，对我来说很好

<ResponsiveContainer height={400} width="100%">
    <ComposedChart
      height={400}
      width="100%"
      margin={{ top: 20, right: 20, bottom: 20, left: 20 }}
    >
      <CartesianGrid />
      <XAxis dataKey="name" />
      <YAxis
        unit="$"
        dataKey="y"
        tickFormatter={val => val.toLocaleString().replace(/,/g, " ")}
      />
      <Scatter
        name="A school"
        data={[
          { name: "Jill", y: 3000000 },
          { name: "Eve", y: 5000000 },
          { name: "Audrey", y: 1000000 },
          { name: "Jaqueline", y: 7000000 }
        ]}
        fill="#8884d8"
      />
      <Tooltip />
    </ComposedChart>
  </ResponsiveContainer>

val.tolocalString（）.replace（/，/g，“”）}
/>

---

如果误解了您的问题，请告诉我。

您可以指定勾号的宽度 比如说,

---

None-breaking空格：

tickFormatter={（value）=>value.toLocaleString（）.replace（//g，'\u00A0'）}