DotNet.Highcharts：成本不暗算正确的日期 [英] DotNet.Highcharts: Cost not plotted against the correct date

问题描述

我创建一个使用两个表中的数据的 DotNet.Highcharts 图：支出和进帐。我使用的是SQL语句来创建一个数据表每个。第一个（对进帐）名为申包含 IncCost 和 IncDate 。名为 DT2 第二个（用于支出）包含 ExpCost 和 EXPDATE 。

I'm creating a DotNet.Highcharts chart that is using data from two tables: Expenditures and Incomings. I am using an SQL statement to create a DataTable for each. The first (for Incomings) called Dt contains IncCost and IncDate. The second (for Expenditures) called Dt2 contains ExpCost and ExpDate.

我能够绘制 IncCost 对 IncDate 和 ExpCost 对 EXPDATE 。在出现问题时，我尝试串联 IncDate 和 EXPDATE （最终）为成本IncCost 和 ExpCost 正密谋反对它涉及到日期的（最后一次），而不是实际日期的位置。

I am able to plot IncCost against IncDate and ExpCost against ExpDate. The problem arises when I try to concatenate IncDate and ExpDate (final) as the cost for IncCost and ExpCost is plotting against the position of the date in (final), and not the actual date it is related to.

下面是我用它来创建数据表的每个来电：

Here are the calls I use to create each 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);

下面是code调用每个这些从数据表

Here is the code for calling each of these from the datatable

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();

这里是code我用它来创建我的highchart：

And here is the code I use to create my highchart:

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) }
    });

正如你所看到的，正在创建的系列，但他们正在暗算阵列中的数量，而不是针对日期应挂。

As you can see, the series are being created but they are being plotted against the number in the array, and not against the date it should be linked to.

我不知道如何接近或远我一个解决方案，但任何帮助是AP preciated。
这里是我的进帐数据表

I'm not sure how close or far I am to a solution but any help is appreciated. Here is my incomings datatable

下面是我的支出数据表

真的不知道如何去这一点。任何信息大大AP preciated

Genuinely don't know how to go about this. any information is greatly appreciated

推荐答案

您Y值由X轴数值完全断开。为了达到你想要什么，你需要如下调整你的数据：

Your Y values are completely disconnected from X values. In order to achieve what you want, you need to restructure your data as below:

        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 }, }) }
             });

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

How to do it dynamically:

        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：成本不暗算正确的日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！