Question

我正在尝试对电压进行可视化，Array有1k个元素，但是现在我正在前10个进行测试，问题是它什么也没显示，当我使用假日期时，更有趣的是现在已被注释掉，它可以正确显示图表。我认为数组可能存在一些问题，因此尝试使用Array.from，但也没有带来任何效果，这是我的代码：

.then(function(res) {
                    var averageVoltage = []
                    var inputVoltage = []
                    var date = []
                    for (var i = 0; i < 10; i++) {
                        if (res[i].average_volatage !== undefined) {
                            averageVoltage.push(res[i].average_volatage)
                            date.push(res[i].timestamp)
                        }
                    }
                    console.log(averageVoltage)
                    console.log(date)

                    Highcharts.chart('battery_chart', {
                        chart: {
                            type: 'line'
                        },
                        title: {
                            text: id
                        },
                        yAxis: {
                            title: {
                                text: 'Measurement'
                            },
                        },
                        xAxis: {
                            categories: date
                        },
                        series: [{
                            name: 'Average Voltage',
                            data: averageVoltage
                            // data: [12283, 12283, 12281, 12280, 12282, 12283, 12281, 12282, 12281, 12280]
                        }, 
                    ]
                    });

，这就是在console.log中显示数组的方式：

Answer 1

您的数组在控制台中也应显示为[12283, 12281, 12280, etc.]，而应显示为[Number, Number, ...]。尝试更改此行：

averageVoltage.push(res[i].average_volatage)

至：

averageVoltage.push(parseInt(res[i].average_volatage))

此外，与其将日期用作类别，不如使用highchart datetime轴。这样一来，您就可以控制日期的显示方式，在一个图形中包含多个带有不同时间戳的序列以及其他许多功能。要使其正常工作，您可以执行以下操作：

.then(function(res) {
  var averageVoltage = []
  var inputVoltage = []
  for (var i = 0; i < 10; i++) {
    if (res[i].average_volatage !== undefined) {
      averageVoltage.push({x: new Date(res[i].timestamp).getTime(), y: parseInt(res[i].average_volatage)})
    }
  }
  console.log(averageVoltage)

  Highcharts.chart('battery_chart', {
    chart: {
      type: 'line'
    },
    title: {
      text: id
    },
    yAxis: {
      title: {
        text: 'Measurement'
      },
    },
    xAxis: {
      type: 'datetime'
    },
    series: [{
      name: 'Average Voltage',
      data: averageVoltage
    }, 
    ]
});

highcharts不读取数据，可处理伪数据

1 个答案: