mariusmuntean / ChartJs.Blazor

Brings Chart.js charts to Blazor
https://www.iheartblazor.com/
MIT License
676 stars 151 forks source link

Error in Getting Started Exampel from README.MD #161

Closed zc0rp10 closed 3 years ago

zc0rp10 commented 3 years ago

Describe the bug

Can't successfully get the example pie chart from README.md Getting Started section working. Problem is with this line: _config.Data.Labels.AddRange(new string[] { "Red", "Yellow", "Green", "Blue" }); IntelliSense reports this problem: 'IList' does not contain a definition for 'AddRange' and no accessible extension method 'AddRange' accepting a first argument of type 'IList' could be found (are you missing a using directive or an assembly reference?) [BlazorProject]csharp(CS1061)

Which Blazor project type is your bug related to?

Which charts does this bug apply to?

PieChart

To Reproduce

Steps to reproduce the behavior:

  1. Using this version of ChartJSBlazor:
  2. Create new project using: dotnet new blazorwasm -o BlazorProject & dotnet add package ChartJs.Blazor.Fork
  3. Follow the instructions from README.md and copy / paste the code examples listed there.
  4. See error: IntelliSense reports this problem: 'IList' does not contain a definition for 'AddRange' and no accessible extension method 'AddRange' accepting a first argument of type 'IList' could be found (are you missing a using directive or an assembly reference?) [BlazorProject]csharp(CS1061)

Expected behavior

That example code is correct and works out of the box.

Additional context / logging

I replaced the line causing the problem with the following to make it work:

string[] dataLabels = { "Red", "Yellow", "Green", "Blue" };
    foreach (var label in dataLabels)
    {
        _config.Data.Labels.Add(label);
    }

Code example

Please provide full code examples below where possible to make it easier for the developers to check your issues.
Please also add the working JavaScript equivalent so we can see what you were trying to achieve.

@page "/"

<h1>Hello, world!</h1>

Welcome to your new app.

<Chart Config="_config"></Chart>

@code {
    private PieConfig _config;

protected override void OnInitialized()
{
    _config = new PieConfig
    {
        Options = new PieOptions
        {
            Responsive = true,
            Title = new OptionsTitle
            {
                Display = true,
                Text = "ChartJs.Blazor Pie Chart"
            }
        }
    };

    _config.Data.Labels.AddRange(new string[] { "Red", "Yellow", "Green", "Blue" });

    PieDataset<int> dataset = new PieDataset<int>(new[] { 6, 5, 3, 7 })
    {
        BackgroundColor = new[]
        {
            ColorUtil.RandomColorString().ToString(),
            ColorUtil.RandomColorString().ToString(),
            ColorUtil.RandomColorString().ToString(),
            ColorUtil.RandomColorString().ToString()
        }
    };

    _config.Data.Datasets.Add(dataset);
}
}
Joelius300 commented 3 years ago

Oh god that is embarrassing. I'm really sorry.

Fixed in 7d6ee10

FYI Here's how this compiles in our samples:

public static void AddRange<T>(this IList<T> list, IEnumerable<T> items)
{
    if (list == null)
        throw new ArgumentNullException(nameof(list));

    if (items == null)
        throw new ArgumentNullException(nameof(items));

    if (list is List<T> asList)
    {
        asList.AddRange(items);
    }
    else
    {
        foreach (T item in items)
        {
            list.Add(item);
        }
    }
}

Btw great issue, thank you for including all the details even with such a stupid error :)

zc0rp10 commented 3 years ago

No worries man! Still very much figuring things out in C# and wasn't half sure I wasn't doing something wrong on my end so figured the more info the better.

I did have a look in the samples by the way and unless I'm mistaking (like I said, very new to this) the same error is present there.

File: ChartJs.Blazor/ChartJs.Blazor.Samples/Client/Pages/Charts/Pie.razor Line: 39 _config.Data.Labels.AddRange(new string[InitalCount] { "Red", "Orange", "Yellow", "Green", "Blue" });

Joelius300 commented 3 years ago

You're correct but in the samples we have that AddRange extension method just like some SampleUtils so it does compile there :)

zc0rp10 commented 3 years ago

Yeah, I can see it now. Thank you for your patience! :smile: