时间戳

首页 > 解决方案 > 如何阻止 ngx-chart 将小数添加到 x 轴

typescript - 如何阻止 ngx-chart 将小数添加到 x 轴

问题描述

我使用 ngx-chart 创建了一个图表。x 轴应填充年份。我的年份数组目前有值：2020、2021、2022、2023。但是，当它显示在图表中时，它会自动添加 2020.5、2021.5、...

该值必须是数字才能按升序对年份进行排序。有没有办法防止小数自动生成？

打字稿：

   setChartValue(items: any[]): void {
    let chartValues = [];

    items.forEach((item) => {
             chartValues.push({
                'name': moment(item.purchaseDate, "DD/MM/YYYY").year(),
                'value': item.purchasePrice
             });
    })

    this.multi = [
        {
            'name': 'Purchase Summary',
            'series': chartValues
        }
    ];
}

html:

<ngx-charts-line-chart [view]="view"
[scheme]="colorScheme"
 [results]="multi"
 [gradient]="gradient"
 [xAxis]="showXAxis"
 [yAxis]="showYAxis"
 [legend]="showLegend"
 [showXAxisLabel]="showXAxisLabel"
 [showYAxisLabel]="showYAxisLabel"
 [xAxisLabel]="xAxisLabel"
 [yAxisLabel]="yAxisLabel"
 [autoScale]="autoScale"
 [timeline]="timeline">
 </ngx-charts-line-chart>

标签： typescriptngx-charts

解决方案

我在 y 轴上有类似的情况，可能会有所帮助。在图表的 html 中，我添加了 [yAxisTickFormatting]="yAxisTickFormattingFn"

在我添加的类定义中： public yAxisTickFormattingFn = this.yAxisTickFormatting.bind(this);

yAxisTickFormatting(value) {
    return value;
}

我不知道为什么这会改变任何东西，但它删除了 y 轴值的“.0”。

推荐阅读