I was wondering if it was possible to add the circular progress component https://mui.com/material-ui/react-progress/ to the middle of a nivo-react sunburst.
const CenteredMetric = ({
nodes,
centerX,
centerY
}: SunburstCustomLayerProps<any>) => {
return <MapProgress x={centerX} y={centerY} value={percentage} />;
};
This is the layer I am adding to the sunburst
const MapProgress: React.FC<MapProgressProps> = ({ value, x, y }) => {
return (
<CircularProgress
variant="determinate"
value={value}
sx={{ position: 'absolute', left: x, top: y }}
/>
);
};
export default MapProgress;
and this is the component I am trying to render in the middle. Any help would be appreciated!