9.单柱状图（SingleBarChart）

愿你出走半生,归来仍是少年！ 

环境：.NET 7、MAUI 

        话接上回（8.多折线图（MuliLineChart）），从折线图变更为单柱状图。

1.转换出单柱图标的ColumnSeries

    /// <summary>
    /// 转换为单柱状
    /// </summary>
    /// <returns></returns>
    public ColumnSeries<double> ToSingleBar()
    {
        var barSeries = new ColumnSeries<double>()
        {
            Name = Name,

            Values = Datas,
            
            IsHoverable = false,//取消展示Tooltip

            //点上的文本 
            DataLabelsFormatter = (point) => { return Labels[point.Index]; },
            DataLabelsPosition = LiveChartsCore.Measure.DataLabelsPosition.Top,
            DataLabelsSize = 12,
            DataLabelsPaint = new SolidColorPaint(SKColors.Black)
            {
                SKTypeface = SKFontManager.Default.MatchCharacter('汉')
            },

        };

        return barSeries;
    }

2.数据设置

 private void InitValue(BasicSerieDto dto)
 {

     Series = new ISeries[] { dto.ToSingleBar() };

     chart.SetBinding(CartesianChart.SeriesProperty, new Binding("Series"));
 }

3.使用

public partial class SingleBarChartDemo : ContentPage
{
    private class Day
    {
        public string name { get; set; }

        public double Money { get; set; }
    }

    public SingleBarChartDemo()
    {
        InitializeComponent();

        List<Day> days = new List<Day>();

        for (int i = 0; i < 7; i++)
        {
            days.Add(new Day()
            {
                name = "周" + i,
                Money = (new Random()).NextDouble() * 10000
            });

        }

        chart.BindData("一周营业额", days.Select(p => p.name).ToList(),
            new BasicSerieDto("",
            days.Select(p => p.Money).ToList(),
             days.Select(p => p.name + "\n" + Math.Round(p.Money, 2)).ToList()) 
            );

    }
}

4.效果

单柱状图效果