Pie Chart example from documentation does not compile

[QazCetelic]

Describe the bug There are several errors:

• PieChart.razor at line 3, column 1: error RZ9985: Multiple components use the tag 'PieChart'. Components: LocalWebInterface.Components.Pages.PieChart, BlazorBootstrap.PieChart, Microsoft.AspNetCore.Components.Ref
• PieChart.razor at line 3, column 28: error CS0029: Cannot implicitly convert type 'BlazorBootstrap.PieChart' to 'LocalWebInterface.Components.Pages.PieChart'
• PieChart.razor at line 35, column 28: error CS1061: 'PieChart' does not contain a definition for 'InitializeAsync' and no accessible extension method 'InitializeAsync' accepting a first argument of type 'PieChart' could be found (are you missing a using directive or an assembly reference?)
• PieChart.razor at line 67, column 24: error CS1061: 'PieChart' does not contain a definition for 'UpdateAsync' and no accessible extension method 'UpdateAsync' accepting a first argument of type 'PieChart' could be found (are you missing a using directive or an assembly reference?)
• PieChart.razor at line 75, column 36: error CS1501: No overload for method 'AddDatasetAsync' takes 3 arguments
• PieChart.razor at line 93, column 36: error CS1501: No overload for method 'AddDataAsync' takes 3 arguments

To Reproduce Steps to reproduce the behavior:

1. Create a Blazor page with the code from https://demos.blazorbootstrap.com/charts/pie-chart.
2. See error

Expected behavior The example compiles. I think it might be because of a version

Versions (please complete the following information):

• BlazorBootstrap: 1.10.5
• Blazor WebAssembly / Server: Server
• .NET Version: .NET 8

Sample code The only difference to the example is the added @page "/piechart".

Piechart.razor

```razor @page "/piechart" Randomize Add Dataset Add Data @code { private PieChart pieChart = default!; private PieChartOptions pieChartOptions = default!; private ChartData chartData = default!; private string[]? backgroundColors; private int datasetsCount = 0; private int dataLabelsCount = 0; private Random random = new(); protected override void OnInitialized() { backgroundColors = ColorBuilder.CategoricalTwelveColors; chartData = new ChartData { Labels = GetDefaultDataLabels(4), Datasets = GetDefaultDataSets(1) }; pieChartOptions = new(); pieChartOptions.Responsive = true; pieChartOptions.Plugins.Title.Text = "2022 - Sales"; pieChartOptions.Plugins.Title.Display = true; } protected override async Task OnAfterRenderAsync(bool firstRender) { if (firstRender) { await pieChart.InitializeAsync(chartData, pieChartOptions); // Cannot resolve symbol 'InitializeAsync' } await base.OnAfterRenderAsync(firstRender); } private async Task RandomizeAsync() { if (chartData is null || chartData.Datasets is null || !chartData.Datasets.Any()) return; var newDatasets = new List(); foreach (var dataset in chartData.Datasets) { if (dataset is PieChartDataset pieChartDataset && pieChartDataset is not null && pieChartDataset.Data is not null) { var count = pieChartDataset.Data.Count; var newData = new List(); for (var i = 0; i < count; i++) { newData.Add(random.Next(0, 100)); } pieChartDataset.Data = newData; newDatasets.Add(pieChartDataset); } } chartData.Datasets = newDatasets; await pieChart.UpdateAsync(chartData, pieChartOptions); // Cannot resolve symbol 'UpdateAsync' } private async Task AddDatasetAsync() { if (chartData is null || chartData.Datasets is null) return; var chartDataset = GetRandomPieChartDataset(); chartData = await pieChart.AddDatasetAsync(chartData, chartDataset, pieChartOptions); // Method 'AddDatasetAsync' has 0 parameter(s) but is invoked with 3 argument(s) } private async Task AddDataAsync() { if (dataLabelsCount >= 12) return; if (chartData is null || chartData.Datasets is null) return; var data = new List(); foreach (var dataset in chartData.Datasets) { if (dataset is PieChartDataset pieChartDataset) data.Add(new PieChartDatasetData(pieChartDataset.Label, random.Next(0, 100), backgroundColors![dataLabelsCount])); } chartData = await pieChart.AddDataAsync(chartData, GetNextDataLabel(), data); // Method 'AddDataAsync' has 0 parameter(s) but is invoked with 3 argument(s) dataLabelsCount += 1; } #region Data Preparation private List GetDefaultDataSets(int numberOfDatasets) { var datasets = new List(); for (var index = 0; index < numberOfDatasets; index++) { datasets.Add(GetRandomPieChartDataset()); } return datasets; } private PieChartDataset GetRandomPieChartDataset() { datasetsCount += 1; return new() { Label = $"Team {datasetsCount}", Data = GetRandomData(), BackgroundColor = GetRandomBackgroundColors() }; } private List GetRandomData() { var data = new List(); for (var index = 0; index < dataLabelsCount; index++) { data.Add(random.Next(0, 100)); } return data; } private List GetRandomBackgroundColors() { var colors = new List(); for (var index = 0; index < dataLabelsCount; index++) { colors.Add(backgroundColors![index]); } return colors; } private List GetDefaultDataLabels(int numberOfLabels) { var labels = new List(); for (var index = 0; index < numberOfLabels; index++) { labels.Add(GetNextDataLabel()); dataLabelsCount += 1; } return labels; } private string GetNextDataLabel() => $"Product {dataLabelsCount + 1}"; private string GetNextDataBackgrounfColor() => backgroundColors![dataLabelsCount]; #endregion Data Preparation } ```

App.razor

```razor ```

I've added builder.Services.AddBlazorBootstrap(); to Program.cs and @using BlazorBootstrap; to _Imports.razor. The default references have also been removed as specified in https://docs.blazorbootstrap.com/getting-started/blazor-webapp-server-global-net-8.

Desktop (please complete the following information):

• OS: Linux - openSUSE Tumbleweed
• Browser: Firefox
• Version: 121.0.1

[gvreddy04]

@QazCetelic Were you successful in running the demos (https://demos.blazorbootstrap.com/charts/pie-chart) without any hiccups?

[QazCetelic]

The demo displays correctly on demos.blazorbootstrap.com. I'm using the same browser, profile, and extensions for testing locally and viewing the demo.

[gvreddy04]

@QazCetelic Would you be able to share a GitHub repository that reproduces the issue, if possible? I'd be happy to take a look.

[QazCetelic]

I'm unable to share the entire solution because it contains code belonging to the company I'm interning at. I've therefore packaged the project (without related projects included in the solution) into an archive file so you can view everything related to the Blazor project.

LocalWebInterface.zip

[gvreddy04]

@QazCetelic What language are you using on your machine?

[QazCetelic]

The code is written in C#

[gvreddy04]

@QazCetelic I mean the OS language culture.

[QazCetelic]

It's a mix of english, danish, and german

Numbers: english/danish Time: english/german Collate: english/danish Currency: english/european Messages: english/danish Paper: english/danish Name: english/danish Address: english/danish Telephone: english/danish Measurement: english/danish Identification: english/danish