微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

日期时间作为 x 轴 blazorise 折线图上的标签

如何解决日期时间作为 x 轴 blazorise 折线图上的标签

我正在尝试将折线图添加到我的 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

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。