Hello, my chart doesn't render in blazor
WASM.
This is the flow of the application SF Grid->button click on row>Opens Modal passing the datasource as a parameter->When model opens, its contents display the chart
I have a SF Grid component in Index.razor, when a button gets clicked on the grid, it will take the rows data and trigger the LoadValueHistory method in Index.cs. The LoadValueHistory passes the Datasource list to the Modal. The modal opens and contains the chart. But the chart in the modal doesn't render. If I do statehaschanged then the chart will render 1 time but not if i click on a different row.
//index.cs
public class ChartData
{
public string X { get; set;}
public double Y {get; set;}
}
//index.cs
private void LoadValueHistory(Model data)
{
LoadData(data.ObjectDataPoints);
ModalController.OpenModal(IndexPageModal.TrendableViewModal);
}
//index.cs
public void LoadData(ValueUpdate valueUpdate)
{
foreach (var value in valueUpdate.History)
{
var roundedValue = value.Value;
var formattedTimestamp = value.Timestamp.toString();
HistoricalData.Add(new ChartData { X = formattedTimestamp, Y = roundedValue });
}
}
//trendable modal.razor
<SfDialog Width="800px" @bind-Visible="@Visibility" IsModal="true" AllowPrerender="false">
<DialogTemplates>
<Header>Trendable View</Header>
<Content>
<SfChart Title="Trends">
<ChartPrimaryXAxis ValueType="Syncfusion.Blazor.Charts.ValueType.Categories"></ChartPrimaryXAxis>
<ChartSeriesCollection>
<ChartSeries DataSource="@HistoricalData" XName="X" YName="Y" Type="ChartSeriesType.Line">
</ChartSeries>
</ChartSeriesCollection>
</SfChart>
</div>
</Content>
</DialogTemplates>
<DialogButtons>
<DialogButton Content="Close" IsPrimary="true" OnClick="@Close"></DialogButton>
</DialogButtons>
</SfDialog>
@code {
[Parameter]
public bool Visibility { get; set; }
[Parameter]
public EventCallback OnClose { get; set; }
[Parameter]
public List<ChartData> HistoricalData { get; set; } = new();
private void Close()
{
Visibility = false;
HistoricalData.Clear();
OnClose.InvokeAsync();
}
