我正在尝试使用数据库中的数据填充图表。我正在使用实体框架,而且对asp.net来说还是新手。
我要做的是从我的linq查询中填充图表。
var totals = from s in db.ClassInstanceDetails.Include("ClassInstance")
where s.ClassInstance.ClassID == 2
group s by s.ClassInstance.Date into grouped
select new
{
CIDate = grouped.Key,
TotalStudentsInClass = grouped.Count(s => s.Attendance)
};
linq查询工作正常,它会计算一个类实例中的所有学生,对它们进行分组并计算它们。我的问题是如何提取数据并将其放入图表中。当我调试时,我可以看到总计变量是
{System.Data.Objects.ObjectQuery<<>f__AnonymousType0<System.DateTime,int>>}
我可以看到总计持有的结果视图:
{CIDate = {04/09/2012}, TotalStudentsInClass = 5}
{CIDate = {05/09/2012}, TotalStudentsInClass = 7}
{CIDate = {06/09/2012}, TotalStudentsInClass = 14}
查询的效果非常好,它会查找有多少学生参加特定的课程实例。我正在尝试使用highcharts将这些数据放入折线图中。我试图将linq结果分成2个数组,一个数组包含日期,另一个数组包含TotalStudentsInClass值,但没有运气因为类型不同???这甚至是正确的方法吗?
我在网上找到的例子来自我认为的数组
.SetSeries(new[]
{
new Series { Name = "Tokyo", Data = new Data(ChartsData.TokioData) },
new Series { Name = "New York", Data = new Data(ChartsData.NewYorkData) },
new Series { Name = "Berlin", Data = new Data(ChartsData.BerlinData) },
new Series { Name = "London", Data = new Data(ChartsData.LondonData) }
}
来自对象的数据,
public static object[] TokioData = new object[] { 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6 };
我已经尝试将我的linq查询运行到一个对象中,但这会让我发现更多错误,而不是我知道如何处理!!
任何帮助都会非常感激!!
答案 0 :(得分:3)
图表
public static Highcharts TimeSeriesZoomable(Series[] Series, Number MinRange, Number PointInterval, DateTime PointStartDate, AxisTypes XAxisType = AxisTypes.Datetime, string Title = "", string SubTitle = "", string XAxisTitle = "", string YAxisTitle = "", string ToolTipFormat = "", string YAxisLabel = "")
{
Highcharts chart = new Highcharts("chart")
.SetOptions(new GlobalOptions { Global = new Global { UseUTC = false } })
.InitChart(new Chart { ZoomType = ZoomTypes.X, SpacingRight = 20, DefaultSeriesType = ChartTypes.Area, Height = 300, BorderRadius = 0 })
.SetTitle(new Title { Text = Title })
.SetSubtitle(new Subtitle { Text = SubTitle })
.SetXAxis(new XAxis
{
Type = XAxisType,
MinRange = MinRange,
Title = new XAxisTitle { Text = XAxisTitle }
})
.SetYAxis(new YAxis
{
Title = new YAxisTitle { Text = YAxisTitle },
Min = 0.6,
StartOnTick = false,
EndOnTick = false,
Labels = new YAxisLabels
{
Formatter = @"function() { return this.value +' " + YAxisLabel + "';}"
}
})
.SetTooltip(new Tooltip { Shared = true/*, Formatter = @"function() { return ''+ this.x +' - '+ this.y +' " + ToolTipFormat + "'; }" */})
.SetLegend(new Legend { Enabled = true, VerticalAlign = VerticalAligns.Top })
.SetPlotOptions(new PlotOptions
{
Line = new PlotOptionsLine
{
LineWidth = 3,
Marker = new PlotOptionsLineMarker
{
Enabled = false,
States = new PlotOptionsLineMarkerStates
{
Hover = new PlotOptionsLineMarkerStatesHover
{
Enabled = true,
Radius = 5
}
}
},
Shadow = false,
States = new PlotOptionsLineStates { Hover = new PlotOptionsLineStatesHover { LineWidth = 3 } },
PointInterval = PointInterval,
PointStart = new PointStart(PointStartDate)
},
Spline = new PlotOptionsSpline
{
LineWidth = 3,
Marker = new PlotOptionsSplineMarker
{
Enabled = false,
States = new PlotOptionsSplineMarkerStates
{
Hover = new PlotOptionsSplineMarkerStatesHover
{
Enabled = true,
Radius = 5
}
}
},
Shadow = false,
States = new PlotOptionsSplineStates { Hover = new PlotOptionsSplineStatesHover { LineWidth = 3 } },
PointInterval = PointInterval,
PointStart = new PointStart(PointStartDate)
},
Area = new PlotOptionsArea
{
//FillColor = new BackColorOrGradient(new Gradient
//{
// LinearGradient = new[] { 0, 0, 0, 300 },
// Stops = new object[,] { { 0, "rgb(116, 116, 116)" }, { 1, Color.Gold } }
//}),
LineWidth = 1,
Marker = new PlotOptionsAreaMarker
{
Enabled = false,
States = new PlotOptionsAreaMarkerStates
{
Hover = new PlotOptionsAreaMarkerStatesHover
{
Enabled = true,
Radius = 5
}
}
},
Shadow = false,
States = new PlotOptionsAreaStates { Hover = new PlotOptionsAreaStatesHover { LineWidth = 1 } },
PointInterval = PointInterval,
PointStart = new PointStart(PointStartDate)
}
})
.SetSeries(Series);
return chart;
}
图表数据
public static Series GetTimeSeriesData(IQueryable<YourModel> model, ChartTypes ChartType)
{
List<Series> Series = new List<Series>();
var chartSeries = model.GroupBy(x => x.Name)
.Select(g => new
{
Name = g.Key,
Data = g.Select(x => x.Value).ToArray()
}).ToArray();
foreach (var item in chartSeries)
{
object[] data = item.Data.Cast<object>().ToArray();
Series localSeries = new Series { Name = item.Name, Data = new Data(data), Type = ChartType };
Series.Add(localSeries);
}
return Series;
}
用法
IQueryable<YourModel> model;
ChartData chartData = new ChartData();
Highcharts chart = new HighChart("chart_time_series");
try
{
model = db.ClassInstanceDetails.AsQueryable();
chartData = GetTimeSeriesData(model, ChartTypes.Line);
chart = TimeSeriesZoomable(chartData.ToArray(), another_options);
}
catch (Exception e)
{
}
完整的图表示例:http://dotnethighcharts.codeplex.com/releases/view/85324
答案 1 :(得分:0)
您使用的是Highcharts.Net吗?如果是这样,我不确定我能提供多少帮助(我只是手动完成,创建我自己的对象并转换为JSON等,我发现它可以让我完全控制,尽管需要更多的努力) 无论如何,这通常在很大程度上取决于你的X轴需要如何表现......看起来它只是离散的日期时间值(不是自动顺序),所以你的对象数组可能需要由X和Y组成 - 值,而不仅仅是Y值,因为它看起来你在那里。
下一部分真的取决于你的实现如何工作,所以请原谅伪伪代码...... 你需要一个二维数组: 例如:data = [[1,1],[2,5],[3,4] ...]
或者更具体的东西:我使用的是一个具有X和Y属性的类(除其他外),但你可以试试匿名类型吗? 例如[{x = 1,y = 1},{x = 2,y = 5},{x = 3,y = 4} ...]等
这有帮助吗? 注意:您可能想要了解如何转换x轴的日期时间值 - 我必须从Epoch等计算滴答数