javascript - X 轴上的 Nivo Line Formatting 时间刻度

Question

我想用我使用的时间格式化折线图的 x 轴 @nivo/line图表的 react 库

 axisBottom={{
   tickValues: 3,
   tickRotation: 90,
   format: (values) => `${getRequiredDateFormat(values, 'MMMM-DD')}`, // using momentjs to format   
   legendOffset: -80,
   legendPosition: 'start',
}}

只想根据数据显示每个月出现一次。

CodeSandbox Link在这里试试

Answer 1

您可以创建一个包含所有 x 轴日期的新数组，如果日期出现多次，则显示一次。

这是一个工作示例 -

https://codesandbox.io/s/quirky-leftpad-dwmb9?file=/src/App.js&fbclid=IwAR1dZoKls-dVowdVRoN3pZd8INsHgc2egNdcNLkj3n0nDqMpJQIJdK6vyQ8