图表.js步大小不适用于日期的折线图



我正在用图表绘制一条线.js。我正在根据某个值绘制时间。我想要轴上的固定时隙。我正在使用 stepSize 属性,但它不适用。

这是代码:

var data = {
  labels: [1495015201000, 1495015202000, 1495015203000, 1495015204000, 1495015205000, 1495015206000, 1495015207000, 1495015208000, 1495015209000, 1495015210000, 1495015211000, 1495015212000, 1495015213000, 1495015214000, 1495015215000, 1495015216000, 1495015217000, 1495015218000, 1495015219000, 1495015220000, 1495015221000, 1495015222000, 1495015223000, 1495015224000, 1495015225000, 1495015226000, 1495015227000, 1495015228000, 1495015229000, 1495015230000, 1495015231000, 1495015232000, 1495015233000, 1495015234000, 1495015235000, 1495015236000, 1495015237000, 1495015238000, 1495015239000, 1495015240000, 1495015241000, 1495015242000, 1495015243000, 1495015244000, 1495015245000, 1495015246000, 1495015247000, 1495015248000, 1495015249000, 1495015250000, 1495015251000, 1495015252000, 1495015253000, 1495015254000, 1495015255000, 1495015256000, 1495015257000, 1495015258000, 1495015259000, 1495015260000],
  datasets: [{
    label: "DataSet",
    backgroundColor: "rgba(255,99,132,0.2)",
    borderColor: "rgba(255,99,132,1)",
    borderWidth: 1,
    hoverBackgroundColor: "rgba(255,99,132,0.4)",
    hoverBorderColor: "rgba(255,99,132,1)",
    data: [10, 15, 47, 58, 54, 1, 6, 8],
    scaleOverride: false,
    scaleSteps: 0,
    scaleStartValue: 0,
    scaleStepWidth: 1
  }]
};
var myBarChart = new Chart($("#a"), {
  type: 'line',
  data: data,
  options: {
    scales: {
      yAxes: [{
        scaleLabel: {
          display: true
        }
      }],
      xAxes: [{
        type: 'time',
        autoSkip: false,
        ticks: {
          min: 1495015201000,
          stepSize: 10000,
          max: 1495015260000
        },
        scaleLabel: {
          display: true
        },
      }]
    }
  }
});

JSFiddle link

我需要根据步长在 x 轴上修复缩放。在当前情况下,我需要它的时间差为 10 秒。

您可以使用时间刻度完成您想要的操作,而不是使用刻度配置让 xAxes 跳过 10 秒。

time: {
    unit: 'second',
    unitStepSize: 10
}

JSFiddle 演示:https://jsfiddle.net/q7qnh9so/5/

相关内容

  • 没有找到相关文章

最新更新