如何添加文字居中的饼图与nivo岩石的reactjs？

npm install @nivo/pie

import { ResponsivePie } from '@nivo/pie';

const data = [
  { id: 'A', label: 'Category A', value: 10 },
  { id: 'B', label: 'Category B', value: 20 },
  { id: 'C', label: 'Category C', value: 30 },
  // 添加更多的数据项...
];

const MyPieChart = () => (
  <div style={{ width: '400px', height: '400px' }}>
    <ResponsivePie
      data={data}
      enableRadialLabels={false}
      enableSlicesLabels={true}
      sliceLabel={(slice) => `${slice.label}: ${slice.value}`}
      legends={[
        {
          anchor: 'bottom',
          direction: 'row',
          translateY: 56,
          itemWidth: 100,
          itemHeight: 18,
          itemTextColor: '#999',
          symbolSize: 18,
          symbolShape: 'circle',
          effects: [
            {
              on: 'hover',
              style: {
                itemTextColor: '#000',
              },
            },
          ],
        },
      ]}
    />
  </div>
);