如何解决使用Ng2图表创建折线图,其中X轴显示日期,y轴显示某些事件的计数
我对角度非常陌生,我想创建一个折线图,其中x轴将显示日期,y轴将显示计数,我正在使用linq查询从角度6的数据库和ng2图表包中获取数据创建UI。我的查询如下:
var allExtractedDoc = await _docCogExtractionMetrics.GetAllListAsync ();
var ExtractionRate = allExtractedDoc.GroupBy (t => t.CreationTime.Date).
Select (e => new DocExtDto {
Total = e.Count (),CreationTime = e.Key,ExtractionsPerDay = e.Count (g => g.Result),}).ToList ();
我想在折线图上显示每天进行的提取,但是图表应该仅显示自当前日期起的最近30天的数据,目前我的图表正在填充数据库中所有可用日期的数据,甚至也包括去年的日期。
我的角度代码如下:
public lineChartOptions = {
responsive: true,scales: {
xAxes: [{
type: 'time',time: {
unit: 'month'
}
}]
}
};
public lineChartType = 'line';
public lineChartLegend = true;
public lineChartPlugins = [];
public lineChartColors: Color[] = [
{
borderColor: 'black',backgroundColor: 'rgba(255,255,0.28)',},];
public lineChartLabels: string[] = [
];
public lineChartData: any[] = [
{ data: [],label: 'Extractions Per Day' },];
this._variableLayoutDocumentServiceProxy.extractionsPerDays().subscribe((result: ListResultDtoOfDocExtDto) => {
if (result) {
for (let i = 0; i < result.items.length; i++) {
this.lineChartData[0].data.push(result.items[i].extractionsPerDay);
this.lineChartLabels.push(result.items[i].creationTime.date().toString());
}
}
请让我知道如何设置x轴上的标签范围,使其仅显示最近30天的数据?我在下面添加了一个图像的链接,这是提供给我的线框供参考。 https://i.stack.imgur.com/53erb.png
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。