Question

所以我尝试使用chart.js创建一个简单的图表。该图表包含y轴的价格值和x轴的时间值。数据从API获取。

正确显示y轴值，但对于x值，它们显示为浓缩。这些是我进入图表的选项：

options: {
        title: {
          display: false
        },
        legend: {
          display: false
        },
        scales: {
          xAxes: [{
            type: 'time',
            ticks: {
              source: 'data',
              autoSkip: true,
              autoSkipPadding: 50
            },
            time: {
              parser: 'HH:mm',
              tooltipFormat: 'HH:mm',
              unit: 'minute',
              stepSize: 10,
              displayFormats: {
                'minute': 'HH:mm',
                'hour': 'HH:mm'
              }
            }
          }],
          yAxes: [{
            type: 'linear',
            ticks: {
              beginAtZero: false,
              callback: function(value, index, values) {
                return '$' + value;
              }
            }
          }]
        }
}

我已尝试调整步长，但它无法正常工作。出于某些奇怪的原因，无论我更改了多少数据，x轴上的第一个标签都是 15:14 。可能是什么问题？

可以找到完整的代码here.

提前致谢。

Answer 1

似乎parser并不能很好地发挥作用。只需删除选项中的time: { //parser: 'HH:mm', tooltipFormat: 'HH:mm', unit: 'minute', stepSize: 10, displayFormats: { 'minute': 'HH:mm', 'hour': 'HH:mm' } }，即可看到清晰的结果。

var app = require('../../server/server');

app.models.Realm.find(options,getOrgFil, function (err, resl) { // this instead of serviceOffering.app.models
                          return callback(null, resl); 
                });

＆＃39; chart.js之＆＃39;时间图表显示不正确

1 个答案: