首页 > 解决方案 > Angular 6中泳道图表中的日期格式问题

问题描述

我想将日期类型与字符串类型进行比较,并使用 Angular 6 中的泳道折线图在图表中绘制相同的内容。问题是如果我在 x 轴上绘制日期字段,它工作正常。但是,如果我在 y 轴上绘制它,它就不能按预期工作。它显示为 1,520,000,000,00..

我也尝试过使用 YAxisTickFormatting,但它也没有产生预期的结果。https://stackblitz.com/edit/angular-drzddd?file=src%2Fapp%2Fapp.component.ts

html:

<ngx-charts-line-chart [animations]="false" [scheme]="lineChartColor" [results]="lineChartData" [xAxis]="true" [yAxis]="true"
      [showXAxisLabel]="true" [xAxisLabel]="'Name'" [showYAxisLabel]="true" [yAxisLabel]="'Date'" [roundDomains]="true" [yAxisTickFormatting]="dateTickFormatting" 
      [autoScale]="true"></ngx-charts-line-chart>

打字稿:

    dateTickFormatting(val: any): String {
    if (val instanceof Date) {
      var options = { month: 'long' };
      return (<Date>val).toLocaleString();
    }
  }

如何解决这个问题?

标签: angular

解决方案


推荐阅读