如何在饼图顶点图表上显示标签和值

如何解决如何在饼图顶点图表上显示标签和值

我正在使用角度应用程序中的顶点图表来显示图表。要制作饼图并想自定义饼图，请在饼图切片上按值显示标签，如所附图像中所示。找不到为此的任何解决方案，请帮助任何线索将非常有帮助。 谢谢。

屏幕截图[1]：https://i.stack.imgur.com/vMcHk.png

import { ChartComponent,ApexLegend,ApexDataLabels,ApexFill,ApexPlotOptions,ApexNonAxisChartSeries,ApexResponsive,ApexChart } from 'ng-apexcharts';

export interface ChartOptions {
  series: ApexNonAxisChartSeries;
  chart: ApexChart;
  responsive: ApexResponsive[];
  labels: any[];
  legend: ApexLegend;
  dataLabels: ApexDataLabels;
  fill: ApexFill;
  plotOptions: ApexPlotOptions;
}

export class PieChartComponent implements OnInit {
  @ViewChild('chart') chart: ChartComponent;
  public chartOptions: Partial<ChartOptions>;

  constructor() {}

  ngOnInit(): void {
    this.chartOptions = {
      series: [70.48,29.52],chart: {
        width: 380,type: 'pie',toolbar: {
          tools: {
            download: false,},legend: {
        show: false,labels: ['DII','FII'],fill: {
        colors: ['#ffe163','#694fb6'],plotOptions: {
        pie: {
          startAngle: 110,dataLabels: {
        style: {
          fontSize: '14',fontWeight: '600',colors: ['#000000','#ffffff'],// formatter: function (val) {
        //   return val + "%";
        // }
      },responsive: [
        {
          breakpoint: 480,options: {
            chart: {
              width: 400,legend: {
              position: 'bottom',],};
  }
}

<apx-chart
    [series]="chartOptions.series"
    [chart]="chartOptions.chart"
    [labels]="chartOptions.labels"
    [responsive]="chartOptions.responsive"
    [legend]="chartOptions.legend"
    [dataLabels]="chartOptions.dataLabels"
    [fill]="chartOptions.fill"
    [plotOptions]="chartOptions.plotOptions"
  ></apx-chart>