add new component with range values to fix display

CoorpAcademy · Mar 20, 2024 · aa29ae7 · aa29ae7
1 parent 98df7cf
commit aa29ae7
Showing 1 changed file with 10 additions and 1 deletion.
diff --git a/packages/@coorpacademy-components/src/molecule/learning-profile-radar-chart/index.js b/packages/@coorpacademy-components/src/molecule/learning-profile-radar-chart/index.js
@@ -1,6 +1,14 @@
 import React, {useCallback, useEffect, useState} from 'react';
 import PropTypes from 'prop-types';
-import {Radar, RadarChart, PolarGrid, PolarAngleAxis, ResponsiveContainer, Tooltip} from 'recharts';
+import {
+  Radar,
+  RadarChart,
+  PolarGrid,
+  PolarAngleAxis,
+  ResponsiveContainer,
+  Tooltip,
+  PolarRadiusAxis
+} from 'recharts';
 import {find, findIndex, get} from 'lodash/fp';
 import classnames from 'classnames';
 import style from './style.css';
@@ -195,6 +203,7 @@ const LearningProfileRadarChart = ({data, onClick}, context) => {
         {/* possible to pass gridType="circle" */}
         <PolarGrid strokeDasharray={15} strokeWidth={3} radialLines={false} />
         <PolarAngleAxis dataKey="subject" tick={renderCustomTick} />
+        <PolarRadiusAxis tick={false} axisLine={false} domain={[0, 100]} />
         <Radar
           name="dataset-1"
           dataKey="value"