1. 데이터 정리하기: 각 데이터 포인트에 대한 합계를 계산하려면 데이터를 정리해야 합니다. 데이터를 사용하기 전에 합계를 계산하고, 합계를 포함한 새로운 데이터 배열을 생성합니다.

   const data = [
     { name: 'A', value: 10 },
     { name: 'B', value: 20 },
     { name: 'C', value: 30 },
   ];
      
   const total = data.reduce((sum, entry) => sum + entry.value, 0);
      
   const newData = [...data, { name: 'Total', value: total }];
   

2. Recharts 사용하기: 데이터를 준비했으면, Recharts를 사용하여 차트를 생성합니다. 합계를 포함한 새로운 데이터 배열을 사용하여 차트를 설정합니다.

   import { BarChart, Bar, XAxis, YAxis, Tooltip, Legend } from 'recharts';
      
   const Chart = () => (
     <BarChart width={400} height={300} data={newData}>
       <XAxis dataKey="name" />
       <YAxis />
       <Tooltip />
       <Legend />
       <Bar dataKey="value" fill="#8884d8" />
     </BarChart>
   );
   

위의 예제에서는 reduce 함수를 사용하여 데이터 배열의 각 항목의 값을 합산합니다. 그런 다음, ... 연산자를 사용하여 새로운 데이터 배열을 생성합니다. 마지막으로, 위에서 생성한 newData 배열을 Recharts의 data 속성에 전달하여 차트를 생성합니다.

이러한 방법을 통해 Recharts에서 차트의 각 데이터 포인트에 대한 합계를 표시할 수 있습니다. Recharts 라이브러리의 풍부한 기능을 활용하여 원하는 형식의 차트를 생성할 수 있습니다.

참고: 위의 예제 코드는 ES6 형식으로 작성되었습니다. 필요에 따라 바벨(babel) 등을 사용하여 코드를 변환해야 할 수도 있습니다.