问题描述
我正在尝试将折线图添加到我的 blazor 服务器端项目中,日期在 x 轴上。
如果我将日期转换为字符串,一切都很好,但我需要日期时间,因为间隔不是恒定的,我想在数据点之间使用自动间隔。
如果我使用它自己的日期,如下所示,所有日期都位于 x 轴的第一个刻度上,全部排列在一个整齐的列中。
LineChart<double> lineChart;
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
await HandleRedraw();
}
}
async Task HandleRedraw()
{
await lineChart.Clear();
await lineChart.AddLabels(GetDateTimeLabels());
await lineChart.AddDataSet(GetLineChartDataset());
await lineChart.Update();
}
LineChartDataset<double> GetLineChartDataset()
{
return new LineChartDataset<double>
{
//usual stuff to build the data set
};
}
public DateTime[] GetDateTimeLabels()
{
//fill array with dates
return dateLabels;
}
我尝试给组件添加一个OptionjsonString来表示x轴的类型是时间,像这样:
<LineChart @ref="lineChart" TItem="double" OptionsJsonString="@("{\"scales\": {\"xAxes\": [{\"type\": 'time'}]}}")"/>
但是图表根本没有呈现。 OptionjsonString 可以很好地设置轴的最小值或最大值。
有人可以给我一些指点吗?
解决方法
我解决了它(好吧,两个 SO 用户做到了,Henk Holterman 和 enet)见:Solution needed for Field initializer cannot reference the non-static field method or property in Blazor