, так что у меня есть эти данные:
const systolicAndDiastolicAndPulseAverage = [
{
name:'Systolic Average',
style:'#FFDA83',
id:'right',
category:'Systolic Average',
data: [
{ day: '23/05/2020 04:50', value: 76 },
{ day: '24/05/2020 04:50', value: 98 },
{ day: '25/05/2020 04:50', value: 63 },
{ day: '26/05/2020 04:50', value: 112 },
{ day: '27/05/2020 04:50', value: 81 },
{ day: '28/05/2020 04:50', value: 81 },
{ day: '29/05/2020 04:50', value: 72 },
{ day: '30/05/2020 04:50', value: 74 },
{ day: '31/05/2020 04:50', value: 124 },
]
},
{
name:'Diastolic Average',
style:'#EA1D75',
id:'left',
category:'Diastolic Average',
data: [
{ day: '23/05/2020 04:50', value: 61 },
{ day: '24/05/2020 04:50', value: 65 },
{ day: '25/05/2020 04:50', value: 82 },
{ day: '26/05/2020 04:50', value: 74 },
{ day: '27/05/2020 04:50', value: 69 },
{ day: '28/05/2020 04:50', value: 59 },
{ day: '29/05/2020 04:50', value: 67 },
{ day: '30/05/2020 04:50', value: 71 },
{ day: '31/05/2020 04:50', value: 74 },
]
},
{
name:'Pulse Average',
style:'#5FE3A1',
category:'Pulse Average',
id:'right',
data: [
{ day: '23/05/2020 04:50', value: 80 },
{ day: '24/05/2020 04:50', value: 83 },
{ day: '25/05/2020 04:50', value: 65 },
{ day: '26/05/2020 04:50', value: 72 },
{ day: '27/05/2020 04:50', value: 79 },
{ day: '28/05/2020 04:50', value: 93 },
{ day: '29/05/2020 04:50', value: 96 },
{ day: '30/05/2020 04:50', value: 91 },
{ day: '31/05/2020 04:50', value: 46 },
]
}
]
Я успешно создал гистограмму на повторных диаграммах, используя эти данные, и все отлично и работает нормально, но моя проблема в том, что я хочу взять только день и месяц из дня и передать его xaxis, я просмотрел так много разных документов и чатов github, но ничего не сработало (например, на xaxis он будет содержать только 30/05 31/05 ....), может кто-нибудь, пожалуйста Помогите?
код:
<BarChart
width={1000}
height={300}
data={systolicAndDiastolicAndPulseAverage}
margin={{
top: 5, right: 30, left: 20, bottom: 5,
}}
>
<CartesianGrid strokeDasharray="5 0" tickSize={15} />
<XAxis dataKey="day" type="number" tickFormatter={tickFormatter} scale='time'
domain = {['dataMin','dataMax']}
tickLine={false} axisLine={false} dx={-15} allowDuplicatedCategory={false}/>
<YAxis yAxisId="left" orientation="left" dataKey="value" type="number" tickLine={false} axisLine={false} allowDuplicatedCategory={false}/>
<YAxis yAxisId="right" orientation="right" dataKey="value" type="number" tickLine={false} axisLine={false} allowDuplicatedCategory={false}/>
<Tooltip />
<Legend
layout="horizontal" verticalAlign="top" align="center"
payload={
systolicAndDiastolicAndPulseAverage.map(
item => ({
type: "circle",
id: item.name,
color: item.style,
value: `${item.category}`
})
)
}/>
{systolicAndDiastolicAndPulseAverage.map(s => (
<Bar yAxisId={s.id} barSize={10} dataKey="value" data={s.data} key={s.name} name={s.name} fill={s.style}/>
))}
</BarChart>