ось datetime x на диаграммах - PullRequest
0 голосов
/ 16 июня 2020

, так что у меня есть эти данные:

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>
...