我设法删除了Y轴和X轴线,但这导致了X轴日期值的问题。以前,VictoryChart可以根据数据量将X轴日期很好地呈现为月、日或年。现在一团糟。
我尝试将这一行添加到VictoryAxis
中,但显示无效日期
tickFormat = {d => new Date(d.date_time)}
查看结果
代码:
export function VictoryAreaChart({ chartData, yName }) {
return (
<VictoryChart>
<VictoryLine
animate={{ easing: 'exp' }}
domainPadding={{y: 5}}
height={150}
interpolation="natural"
x={d => new Date(d.date_time)}
y={yName}
data={chartData}
style={{
data: {
stroke: '#4E54C8',
strokeWidth: 2
}
}}
data={chartData}
events={[
{
target: "data",
eventHandlers: {
}
}
]}
/>
<VictoryAxis
style={{ axis: {stroke: { fill: "none" } }}}
/>
<VictoryAxis dependentAxis
style={{ axis: {stroke: { fill: "none" } }}}
/>
</VictoryChart>
);
}
以前X轴是什么样子的
1条答案
按热度按时间w9apscun1#
在
VictoryAxis
中添加tickFormat
,并编写一个函数以格式化日期显示(如有必要)。