0

我正在使用带有 Angular 7 的 chart.js。我提供数组并渲染图表。

初始化。

import * as JSC from 'jscharting';

 this.phLiveChart = JSC.chart('phChart', {
      debug: false,
      type: 'step',
      chartArea_boxVisible: false,
      legend_visible: false,
      defaultTooltip_enabled: false,
      xAxis: {
        scale: {
          range: { min: 0, max: 100, padding: 0.1 }
        }
      },
      defaultSeries: {
        opacity: 0.7
      },
      defaultPoint_label_text: '%yValue',
      series: [{
        name: 'pH',
        points: []
      }]
    });

当数据来自服务器时。

for (let i = 0; i < records.length; i++) {
      if (this.device.sensors.ph == true) {
        records[i].ph  = Number(records[i].ph.toFixed(3));
        this.phLiveChart.series(0).points.add([new Date(records[i].recorded_at), records[i].ph]);
      }
}

问题：有时图表显示我提供的更精确的值。在控制台日志中显示正确的精度，但在图表中显示错误。 在此处输入图像描述

4

1 回答 1

1

通过使用以下选项指定格式字符串很容易控制 JSCharting 中的精度：

yAxis_formatString:'n3'

这将使所有与 y 轴相关的值都是小数点后 3 位的数字。

或者，您可以单独应用标签的格式

defaultPoint_label_text: '{%yValue:n3}'

希望有帮助。

于 2019-12-19T20:00:21.033 回答