Line Series Chart: Give each series a different title when adding dynamically

Radzen.Blazor Components
1

Hello,

I'm adding line series' to a line chart dynamically. I have it working except I can't figure out how to give each line a different title.

Here's what I have that works but gives the same titles:

Chart View:

        @foreach (List<DataItem> line in dataLines)
        {
            <RadzenLineSeries Smooth="@smooth" Data="@line" CategoryProperty="Month" Title="BudgetName" ValueProperty="Amount">
                <RadzenMarkers Visible="@showMarkers" MarkerType="MarkerType.Circle" />
                <RadzenSeriesDataLabels Visible="@showDataLabels" />
            </RadzenLineSeries>
        }

in @code:

    List<DataItem> dataLine = new();
    List<List<DataItem>> dataLines = new();

    class DataItem
    {
        public int Month { get; set; }
        public decimal Amount { get; set; }
    }

I tried to change it to this to account for separate titles:

        @foreach (BudgetItemLine line in budgetLines)
        {
            <RadzenLineSeries Smooth="@smooth" Data="@line.dataItems" CategoryProperty="Month" Title="BudgetName" ValueProperty="Amount">
                <RadzenMarkers Visible="@showMarkers" MarkerType="MarkerType.Circle" />
                <RadzenSeriesDataLabels Visible="@showDataLabels" />
            </RadzenLineSeries>
        }

    List<BudgetItemLine> budgetLines = new();

    class BudgetItemLine
    {
        List<DataItem> dataItems = new();
        string Name = "";
    }

However, the Data property gives an error. Any suggestions on how to do this correctly?

2

You need to make the Title unique.

<RadzenLineSeries Smooth="@smooth" Data="@line.dataItems"   
  CategoryProperty="Month"
  Title="@line.Name" 
  ValueProperty="Amount">

What's the error? Probably you should make the dataItems and Name fields public as they are now private.

3

Yep, that was the problem. I forgot private was the default. Thank you!

4

But now I'm having a potentially related problem? The titles display correctly but the data won't show. I know there's data in the lists but the chart isn't showing them. This is what I have now:

    <RadzenChart>
        <RadzenChartTooltipOptions Shared="@sharedTooltip" />
        @foreach (BudgetItemLine line in budgetLines)
        {
            <RadzenLineSeries Smooth="@smooth" Data="@line.dataItems" CategoryProperty="Month" Title="@line.BudgetName" ValueProperty="Amount">
                <RadzenMarkers Visible="@showMarkers" MarkerType="MarkerType.Circle" />
                <RadzenSeriesDataLabels Visible="@showDataLabels" />
            </RadzenLineSeries>
            <RadzenCategoryAxis Padding="20" />
            <RadzenValueAxis Formatter="@FormatAsUSD" Min="0" Max="5000">
                <RadzenGridLines Visible="true" />
                <RadzenAxisTitle Text="Revenue in USD" />
            </RadzenValueAxis>
        }
    </RadzenChart>

    class BudgetItemLine
    {
        public List<DataItem> dataItems = new();
        public string BudgetName = "";
    }

    class DataItem
    {
        public int Month { get; set; }
        public decimal Amount { get; set; }
    }

    string FormatAsUSD(object value)
    {
        return ((double)value).ToString("C0", CultureInfo.CreateSpecificCulture("en-US"));
    }

I can put it in a new topic if needed. It might be an entirely different problem.

5

Is this the complete code? As right now there are no items. I suggest debugging your code to see if the items in the budgetList collections are OK.

6

I thought I had but I paid more attention this time. Something else is going on that the dataItems are empty but I'm sure I can figure it out. Sorry about that, that was sloppy of me.

Thank you!