我正在使用angularjs上的chartjs,如果我将x轴显式指定为ChartLabels,则可以按预期显示图表,但是如果尝试在下面的数据部分中包含x轴和y轴数据,则不会在图表中显示x轴坐标。 Y轴数据符合预期。
由于我有多个数据集,因此我需要为每个数据集显式设置x轴和y轴。
这是我的组件详细信息。
import { Component, OnInit } from '@angular/core';
import { Dbgrowthinfo } from '../dbgrowth-info/dbgrowth-info.component';
@Component({
selector: 'app-bargraph',
templateUrl: './bargraph.component.html',
styleUrls: ['./bargraph.component.css']
})
export class BargraphComponent implements OnInit {
constructor() { }
public barChartOptions = {
scaleShowVerticalLines: false,
responsive: true
};
public ChartType = 'line';
public ChartLegend = true;
public ChartData = [
{data: [{x:"2019-01-28", y:"1.1714705882352941176470588235294117647101"},
{x:"2019-01-29", y:"8.8430555555555555555555555555555555555602"},
{x:"2019-01-30", y:"8.8916666666666666666666666666666666666702"},
{x:"2019-01-31", y:"9.1368055555555555555555555555555555555602"}
], label: 'Series A'}
];
}
下面是我的html页面的内容。
<div>
<div style="display: block">
<canvas baseChart
[datasets]="ChartData"
[options]="ChartOptions"
[legend]="ChartLegend"
[chartType]="ChartType">
</canvas>
</div>
</div>