DotNet.Highcharts：未根据正确日期绘制成本

Question

我正在创建一个 DotNet.Highcharts 图表，该图表使用两个表中的数据：支出和收入。我正在使用 SQL 语句为每个创建一个 DataTable。第一个（对于传入）称为 Dt 包含 IncCost 和 IncDate。第二个（用于支出）称为 Dt2 包含 ExpCost 和 ExpDate.

我可以策划 IncCost 反对 IncDate 和 ExpCost 反对 ExpDate。当我尝试连接 IncDate 和 ExpDate（最终）时出现问题，因为 IncCost 和 ExpCost 的成本是针对（最终）中日期的位置绘制的，而不是它相关的实际日期。

下面是我用来创建每个 DataTable 的调用：

SqlDataAdapter Adp = new SqlDataAdapter("select CONVERT(DATETIME, IncDate, 103) AS IncDate, SUM(IncCost) AS IncCost from Incomings GROUP BY CONVERT(DATETIME, IncDate, 103) ORDER BY CONVERT(DATETIME, IncDate, 103)", con);

SqlDataAdapter Adp2 = new SqlDataAdapter("select CONVERT(DATETIME, ExpDate, 103) AS ExpDate, SUM(ExpCost) AS ExpCost from Expenditures GROUP BY CONVERT(DATETIME, ExpDate, 103) ORDER BY CONVERT(DATETIME, ExpDate, 103)", con);

下面是从数据表中调用每一个的代码

var dateArr = Dt.AsEnumerable().Select(r => r.Field<DateTime>("IncDate")).ToArray();
var objectArr = Dt.AsEnumerable().Select(r => r.Field<object>("IncCost")).ToArray();

var dateArr2 = Dt2.AsEnumerable().Select(r => r.Field<DateTime>("ExpDate")).ToArray();
var objectArr2 = Dt2.AsEnumerable().Select(r => r.Field<object>("ExpCost")).ToArray();   

var res = dateArr.Concat(dateArr2).ToArray();
var final = res.Select(d => d.ToString(@"dd\/MM\/yyyy")).ToArray();

这里是我用来创建图表的代码：

Highcharts chart = new Highcharts("graph")
  .SetTitle(new Title { Text = "Incoming Stats" })
  .SetXAxis(new[] { new XAxis { Categories = final } })
  .SetYAxis(new YAxis { Title = new YAxisTitle { Text = "Amount Incoming" } })
  .SetSeries(new[]
    {
      new Series { Name = "inc", Data = new Data(objectArr)},
      new Series { Name = "exp", Data = new Data(objectArr2) }
    });

如您所见，正在创建系列，但它们是根据数组中的数字绘制的，而不是根据它应该链接到的日期绘制的。

我不确定我离解决方案有多近或多远，但我们将不胜感激。这是我的收入数据表

这是我的支出数据表

真的不知道该怎么做。非常感谢任何信息

Answer 1

您的 Y 值与 X 值完全脱节。为了实现你想要的，你需要重组你的数据如下：

        DateTime dt = new DateTime(2016, 2, 27);

        Highcharts chart = new Highcharts("graph")
           .SetTitle(new Title { Text = "Incoming Stats" })
           .SetXAxis(new XAxis { Type = AxisTypes.Datetime })
           .SetYAxis(new YAxis { Title = new YAxisTitle { Text = "Amount Incoming" } })
           .SetSeries(new[]
             {
              new Series { Name = "inc", Data = new Data(new object[,] { 
                  {dt , 23 }, 
                  {dt.AddDays(1) , 223 }, 
                  {dt.AddDays(2) , 51 }, 
                  {dt.AddDays(11) , 200 }, }) },
              new Series { Name = "exp", Data = new Data(new object[,] { 
                  {dt.AddDays(5) , 100 }, 
                  {dt.AddDays(6) , 23 }, 
                  {dt.AddDays(11) , 23 }, 
                  {dt.AddDays(19) , 35 }, 
                  {dt.AddDays(35) , 288 }, }) }
             });

编辑： 如何动态地做到这一点：

        object[,] data1 = new object[Dt.Rows.Count, 2];
        for (int i = 0; i < Dt.Rows.Count; i++)
        {
            data1[i, 0] = Dt.Rows[i]["IncDate"];
            data1[i, 1] = Dt.Rows[i]["IncCost"];
        }

        object[,] data2 = new object[Dt2.Rows.Count, 2];
        for (int i = 0; i < Dt2.Rows.Count; i++)
        {
            data2[i, 0] = Dt2.Rows[i]["ExpDate"];
            data2[i, 1] = Dt2.Rows[i]["ExpCost"];
        }

        Highcharts chart = new Highcharts("graph")
           .SetTitle(new Title { Text = "Incoming Stats" })
           .SetXAxis(new XAxis { Type = AxisTypes.Datetime })
           .SetYAxis(new YAxis { Title = new YAxisTitle { Text = "Amount Incoming" } })
           .SetSeries(new[]
             {
                    new Series { Name = "inc", Data = new Data(data1) },
                    new Series { Name = "exp", Data = new Data(data2) }
             });

从数据库中检索到的数据：

DotNet.Highcharts：未根据正确日期绘制成本

DotNet.Highcharts: Cost not plotted against the correct date

c#

sql

asp.net

datatable

dotnethighcharts