reactjs - chartjsのデザインで円グラフにコンテンツを配置する

Question

React の Chart js でデザインを作成しましたが、すべてのパレットにアイコンを入力したいと考えています。だから、誰かが私を助けてくれませんか？こちらの画像をご覧ください https://drive.google.com/file/d/1NsS6ARTrhITQQWQRk0e55vIgBkO00CqP/view?usp=sharing

左側の画像は私が今までに作ったものを表し、右側は私が望んでいたものを表しています。ありがとうございました

<CCardBody className="p-0 piechart-nav">
      <CChartPie
        datasets={[
          {
            backgroundColor: [
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
              "rgba(0, 120, 210, 0.8)",
            ],
            hoverBackgroundColor: [
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
              "rgba(60, 60, 110, 1)",
            ],
            data: [36, 36, 36, 36, 36, 36, 36, 36, 36, 36],
          },
        ]}
        labels={[
          "This is Business.",
          "this is Good News.",
          "this is Religious Service. ",
          "this is Resource. ",
          "this is Organization. ",
          "this is Professional.",
          "this is Hotel & Restaurants.",
          "this is Music Video and Talent Show. ",
          "this is Events. ",
          "this is Discussion & forums.",
        ]}
        options={{
          tooltips: {
            enabled: true,
            bodyFontSize: 20,
            yPadding: 25,
            xPadding: 25,
            displayColors: false,
            callbacks: {
              label: function (tooltipItems, data) {
                return data.labels[tooltipItems.index];
              },
            },
            yAlign: "bottom",
            callbacks: {
              labelColor: function (tooltipItem, chart) {
                return {
                  backgroundColor: "rgba(60, 60, 110, 1)",
                };
              },
            },
            backgroundColor: "rgba(60, 60, 110, 1)",
          },
          legend: {
            display: false,
          },
          layout: {
            padding: {
              left: -0,
            },
          },
    
          responsive: true,
          maintainAspectRatio: false,
        }}
      />
    </CCardBody>;