DotNet.Highcharts：成本没有绘制正确的日期 [英] DotNet.Highcharts: Cost not plotted against the correct date

问题描述

我正在使用两个表格中的数据创建一个

正如你所看到的，系列正在被创建，但它们正在绘制数组中的数字，而不是与它应该链接的日期。

我不知道我是多么接近或远的一个解决方案，但任何帮助是赞赏。
这是我的收入datatable

这是我的支出数据表

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

解决方案

您的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}，}）} 
}）; 
  

编辑：
动态如何做：

 对象[，] data1 = new object [Dt.Rows.Count，2]; （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]; （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 [] 
 {
新系列{Name =inc，Data = new Data（data1）}，
 new Series {Name =exp，Data = new Data（data2）} 
}）; 
  

从数据库检索的数据：

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.

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

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

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.

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

Here is my expenditure datatable

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

解决方案

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

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

Data retrieved from database:

这篇关于DotNet.Highcharts：成本没有绘制正确的日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！