@mui/x-charts/esm/RadarChart/RadarMetricLabels/useRadarMetricData.js

The community edition of MUI X Charts components.

import { useDrawingArea } from "../../hooks/useDrawingArea.js";
import { useRadiusAxes, useRotationAxis } from "../../hooks/useAxis.js";
import { rad2deg } from "../../internals/angleConversion.js";
export function useRadarMetricData() {
  const rotationAxis = useRotationAxis();
  const {
    scale: rotationScale,
    valueFormatter,
    labelGap = 10
  } = rotationAxis;
  const {
    radiusAxis
  } = useRadiusAxes();
  const drawingArea = useDrawingArea();
  const cx = drawingArea.left + drawingArea.width / 2;
  const cy = drawingArea.top + drawingArea.height / 2;
  const metrics = rotationScale.domain();
  const angles = metrics.map(key => rotationScale(key));
  return {
    corners: metrics.map((metric, dataIndex) => {
      const radiusScale = radiusAxis[metric].scale;
      const r = radiusScale.range()[1] + labelGap;
      const angle = angles[dataIndex];
      return {
        x: cx + r * Math.sin(angle),
        y: cy - r * Math.cos(angle),
        angle: rad2deg(angle),
        label: valueFormatter?.(metric, {
          location: 'tick',
          scale: rotationScale
        }) ?? metric
      };
    })
  };
}