import React from 'react'; import { Radar, RadarChart, PolarGrid, PolarAngleAxis, PolarRadiusAxis, ResponsiveContainer } from 'recharts'; import { salesByBrand } from './constants'; import { useTheme } from '@material-ui/core'; export default function SimpleRandarChart() { const theme = useTheme(); return ( <ResponsiveContainer width="100%" minWidth={500} height={350}> <RadarChart cx={200} cy={150} outerRadius={150} data={salesByBrand}> <PolarGrid /> <PolarAngleAxis dataKey="brand" tick={{ fill: theme.palette.contrastText, fontSize: 12 }} /> <PolarRadiusAxis /> <Radar name="Brand" dataKey="sales" stroke="#8884d8" fill="#8884d8" fillOpacity={0.6} /> </RadarChart> </ResponsiveContainer> ); }