如何用高图表制作图表，从API加载数据

Question

我是一个新的程序员，这是我第一次使用高图表。我也有这样的代码使用highstocks库：

Highcharts.getJSON('https://gmlews.com/api/data', function(data) {
  console.log(data);
  var accelero_x = [],
    timestamp = [];
  for (var i = 0; i < data.length; i++) {
    accelero_x.push(data[i].accelero_x);
    timestamp.push(data[i].timestamp);
  }
  console.log(accelero_x);
  console.log(timestamp);
  // Create the chart
  Highcharts.stockChart('container', {

    rangeSelector: {
      selected: 1
    },

    title: {
      text: 'Accelero X'
    },

    series: [{
      name: 'Accelero X',
      data: accelero_x,
      type: 'spline',
      tooltip: {
        valueDecimals: 2
      }
    }]
  });
});

您可以在：https://jsfiddle.net/estri012/y1usoxd7/1/上看到完整的运行代码：

问题是如何根据我的时间戳制作x轴？

在正确处理x轴之后的新问题是:在我的api中，最近的一些数据是在193月。但在图表上，最新数据显示的是3月18日，而不是3月19日。实际上，在我的API中，3月18日没有一个数据。您可以在上面的URL上检查api。与此同时，之前的其他数据在图表上显示了正确的日期。这是对图表的捕捉：

​

Answer 1

在这种情况下，您需要将数据转换为高级图表所需的格式--数组或objcts数组({ x，y })。

Highcharts.getJSON('https://gmlews.com/api/data', function(data) {
  var seriesData = [];

  for (var i = 0; i < data.length; i++) {
    seriesData.push([
      new Date(data[i].timestamp).getTime(),
      data[i].accelero_x
    ]);
  }

  // Create the chart
  ...
});

现场演示： https://jsfiddle.net/BlackLabel/82vqcwsr/

API参考： https://api.highcharts.com/highstock/series.line.data