How to perform a pivot grid in maui?

Hi, i want to display data from observablecollection in a pivotgrid using .Net Maui 8 like in the picture below.

the columns are generated programatically. i write this code in the viewmodel:

Stockstcviews = JsonConvert.DeserializeObject<ObservableCollection<stockstcviews>>(response.Content.ToString());

if (Stockstcviews.Count != 0)

{

 await displaystockbysite(Stockstcviews);

Device.BeginInvokeOnMainThread(() =>

{

    OnPropertyChanged(nameof(Stockstcviews));

    DataGrid.ItemsSource = Stockstcviews; // Set the ItemsSource of DataGrid

}); 

}

and in my function private async Task displaystockbysite(ObservableCollection<stockstcviews> Stockstcviews)

{

try

{

     // Accéder à la DataGrid à partir du ViewModel

    var dataGrid = this.DataGrid;

    if (Stockstcviews.Count > 0)

    {

        var distinctsite = Stockstcviews.Select(x => new { x.siteordree, x.siteid, x.siteabrege }).Distinct();

        var distinctcouleurid = Stockstcviews.OrderBy(x => x.ordree).Select(x => x.couleurid).Distinct().ToList();

        var distinctcouleur = Stockstcviews.OrderBy(x => x.ordree).Where(x => distinctcouleurid.Contains(x.couleurid)).Select(x => new { x.couleurid, x.couleurlibelle, x.couleurcode, x.ordree }).Distinct().ToList();

        // Stockstcviews is an ObservableCollection 

        foreach (var det in distinctsite.OrderBy(x => x.siteordree))

        {

            var column = new DataGridTextColumn

            {

                

                AllowEditing = false,

                CellPadding = new Thickness(10, 0, 0, 0),

                HeaderPadding = new Thickness(10, 0, 0, 0),

                HeaderText = det.siteabrege,

                HeaderTextAlignment = TextAlignment.Center,

                MappingName = det.siteabrege,

                MinimumWidth = 100

            };

            dataGrid.Columns.Add(column);

        }

        // Populate rows with data

        dataGrid.ItemsSource = Stockstcviews;

}

How to performe that please?