10.Rechart

Recharts는 React.js를 기반으로 한 데이터 시각화 라이브러리입니다.

Recharts는 다양한 차트 유형, 축 스케일링, 사용자 정의 라벨, 축 조절 및 기타 시각화 관련 기능을 제공합니다.

 

1. Recharts 설치하기

npm install recharts --save

2. Recharts 코드 적용하기

1) import

import {
	ResponsiveContainer,
	ComposedChart,
	Line,
	Bar,
	XAxis,
	YAxis,
	CartesianGrid,
	Tooltip,
	Legend,
} from 'recharts';

2) component 추가

 

 <ResponsiveContainer width="100%" height="100%">
        <BarChart width={150} height={40} data={data}>
          <Bar dataKey="uv" fill="#8884d8" />
        </BarChart>
 </ResponsiveContainer>