mapo-core/MP.SPEC/Components/Chart/Doughnut.razor.cs

using Microsoft.AspNetCore.Components;
using Microsoft.JSInterop;
using MP.Data;
using MP.SPEC.Data;
using static System.Net.Mime.MediaTypeNames;

namespace MP.SPEC.Components.Chart
{
    public partial class Doughnut
    {
        [Inject]
        private IJSRuntime JSRuntime { get; set; } = null!;


        public enum ChartType
        {
            Pie,
            Bar,
            Doughnut
        }

        //[Parameter]
        public string Id { get; set; } = "myChart";

        [Parameter]
        public ChartType Type { get; set; }

        [Parameter]
        public double[] Data { get; set; } = null!;
        [Parameter]
        public List<DoughnutStyling> BackgroundColor { get; set; } = null!;

        [Parameter]
        public string[] Labels { get; set; } = null!;

        protected override async Task OnAfterRenderAsync(bool firstRender)
        {
            var config = new
            {
                Type = Type.ToString().ToLower(),
                Options = new
                {
                    Responsive = true,
                },
                Data = new
                {
                    Datasets = new[]
                    {
                    new { Data = Data, BackgroundColor = BackgroundColor.Select(x=>x.color), borderColor = BackgroundColor.Select(x=>x.border), borderWidth= 0, offset= 1, borderRadius = 0
    }
},
                    Labels = Labels
                }
            };

            await JSRuntime.InvokeVoidAsync("setup", Id, config);
        }
    }
}