0

I have a chart built with react-chartjs-2. The chart displays when I enter the values for data directly in the datasets like this.

datasets: [
        {
          label: "Active Countries",
          backgroundColor: gradientFill,
          borderColor: "#2CA8FF",
          pointBorderColor: "#FFF",
          pointBackgroundColor: "#2CA8FF",
          pointBorderWidth: 2,
          pointHoverRadius: 4,
          pointHoverBorderWidth: 1,
          pointRadius: 4,
          fill: true,
          borderWidth: 1,
          data: [80, 99, 86, 96, 123, 85, 100, 75, 88, 90, 123, 155]
        }
      ]

However, I want to replace the value of the data in the datasets with a monthly transaction derived from transactions recorded in my database. The code for my total transaction for each month Jan to Dec ( One for each month) is like this.

const januaryTransactions = transactions.filter(i => {
        const date = new Date(i.date);
        return date.getMonth() === January && date.getYear() === relevantYear;
        }).reduce((prev, curr) => prev + parseFloat(curr.amount), 0)
   

My question is how do I replace for example the value at in index 0 [80, 99, 86, 96, 123, 85, 100, 75, 88, 90, 123, 155] which is 80 with januaryTransactions .

Any Pointers are mostly appreciated!!

Adeola Oni
  • 55
  • 1
  • 9
  • you want to change this data: [80, 99, 86, 96, 123, 85, 100, 75, 88, 90, 123, 155] to that data: [[80, 99, 86, 96, 123, 85, 100, 75, 88, 90, 123, 155], otherArrays] ?? – Farhani Walid May 21 '20 at 22:37
  • @Farhani Walid Each of the data in the array represents total transactions per month. but now, using the method above I can get the data for each month from the database. the problem is how do I replace the hard-coded data with the actual data coming from the method indicated. – Adeola Oni May 22 '20 at 08:17

0 Answers0