[英]Set min/max date for date in Recharts.js
I'm using Recharts.js to display chart data in my website.我正在使用 Recharts.js 在我的网站中显示图表数据。 However I want to set minimum/maximum value of XAxis which is date type but try with domain didn't worked to me:但是我想设置 XAxis 的最小值/最大值,这是日期类型,但尝试使用域对我不起作用:
<ResponsiveContainer width="100%" height={200}>
<BarChart
width={400}
height={200}
data={data}
margin={{
top: 20,
left: 5,
bottom: 5,
right: 5
}}
>
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="time" tickFormatter={timeStr => moment(timeStr).format(timeFormat)} />
<YAxis dateKey="count" type="number" allowDecimals={false} tickCount={10} />
<Tooltip formatter={(value, name) => [value, startCase(name)]} />
<Bar dataKey="count" fill="#8884d8" />
</BarChart>
</ResponsiveContainer>
Key part is :关键部分是:
<XAxis dataKey="time" tickFormatter={timeStr => moment(timeStr).format(timeFormat)} />
domain={['2018-01-01', '2019-12-31']}
domain={['2018-01-01 00:00:00', '2019-12-31 00:00:00']}
domain={['2018-01-01T00:00:00.000+09:00', '2019-12-31T23:59:59.999+09:00']}
domain={[new Date('2018-01-01'), new Date('2019-12-31')]}
domain={[new Date('2018-01-01').getTime(), new Date('2019-12-31').getTime()]}
domain={[moment('2018-01-01').format('YYYY-MM-DD'), moment('2019-12-31').format('YYYY-MM-DD')]}
Still first date set to earliest date and last date to latest date.仍然第一个日期设置为最早日期,最后一个日期设置为最晚日期。 What am I missing here?我在这里缺少什么?
domain
works with number type of 'number' type axis only; domain
适用于“数字”类型轴的数字类型;
When you provide date with quotes it becomes a category;当您提供带引号的日期时,它就成为一个类别;
You need to convert date
in unix epoch ie seconds from 1 Jan 1970;您需要在 unix epoch 中转换date
,即从 1970 年 1 月 1 日开始的秒数;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.