Chart.js-时间轴

Question

我正在尝试通过Chart.js在xAxes上显示日期

我尝试了2个日期，但未显示任何内容。标签或日期格式可能是我做错了。

<canvas id="graph"></canvas>

<script>
    var ctx = document.getElementById('graph').getContext('2d');
    var myChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: ["2013-02-08", "2013-02-10"],
            datasets: [{
                label: "Something",
                data: [{
                    x: "2013-02-08",
                    y: 1
                }, {
                    x: "2013-02-10",
                    y: 10
                }]
            }]
        },
        options: {
            scales: {
                xAxes: [{
                    type: 'time',
                    time: {
                        unit: 'day'
                    }
                }]
            }
        }
    });
</script>

需要帮助：）

Answer 1

您的代码看起来不错，但您不需要定义data.labels，因为通过包含data和individual points属性的对象将数据集中的x定义为y。

Chart.js在内部将Moment.js用于time axis的功能。因此，您应该使用在单个文件中包含Moment.js的Chart.js的bundled version。

var ctx = document.getElementById('graph').getContext('2d');
var myChart = new Chart(ctx, {
  type: 'line',
  data: {
    datasets: [{
      label: "Something",
      data: [
        { x: "2013-02-08", y: 1 }, 
        { x: "2013-02-10", y: 10 }
      ]
    }]
  },
  options: {
    scales: {
      xAxes: [{
        type: 'time',
        time: {
          unit: 'day'
        }
      }]
    }
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.min.js"></script>
<canvas id="graph"></canvas>