时间戳

首页 > 解决方案 > VictoryChart 不更改日期数据

javascript - VictoryChart 不更改日期数据

问题描述

我有一个胜利图和两个坐标轴，按照这张图

https://formidable.com/open-source/victory/gallery/multiple-dependent-axes/

没有什么我可以描述的，但这个图表现在看起来像这样 在此处输入图像描述

但问题是我无法更改日期数据，尽管我更改了日期

<VictoryAxis
  crossAxis={true}
  tickCount={12}
  data={date}
  tickFormat={(x) => {
    console.log(x);
    return x.toLocaleString("vn-vn", {
      month: "short",
      day: "numeric"
    });
  }}
/>

和日期数据

const date = [
  { x: new Date(2000, 3, 4) },
  { x: new Date(2003, 4, 17) },
  { x: new Date(2004, 1, 1) },
  { x: new Date(2005, 1, 1) },
  { x: new Date(2006, 1, 1) },
  { x: new Date(2007, 2, 1) },
  { x: new Date(2008, 1, 1) }
];

但它总是显示1 jan，请帮助

这是现场演示和数据

https://codesandbox.io/s/chart2-11eut?file=/src/App.js:776-1010

太感谢了

标签： javascriptreactjsreact-nativevictory-charts

解决方案

使用数组：

const date = [
  new Date(2000, 3, 4),
  new Date(2003, 4, 17),
  new Date(2004, 1, 1),
  new Date(2005, 1, 1),
  new Date(2006, 1, 1),
  new Date(2007, 2, 1),
  new Date(2008, 1, 1)
];

将 JSX 修改如下：

  <VictoryAxis
  crossAxis={true}
  tickValues={date}
  tickCount={date.length}
  tickFormat={(x) => {
    return x.toLocaleString("vn-vn",
      {month: "short", day: "numeric"})
    }
  } 
/>

推荐阅读