Json 反应：如何在highchart中绘制API响应

您好，我有一个reacr/flask应用程序，当您输入一个关键字时，它会将其发送到flask，检查一些数据，然后将其发送回以作为以下json响应：

我希望能够使用“highcharts react official”软件包绘制这些值

到目前为止，我可以在控制台上看到我的反应，但在图表上什么也看不到。我把日期改成了时间戳，但不确定是更好还是应该使用datetime，如果需要，我可以把它改回去

我的代码如下：

import React，{Component}来自'React'；
从“axios”导入axios；
从“Highcharts”导入Highcharts
从“highcharts反应官方”导入highcharts反应
类关键字扩展组件{
状态={
kws:[]
}
关键字=e=>{
e、 预防默认值（）；
post（“/trends”，{search_关键字：document.getElementById（“关键字”）.value}）
。然后（（res）=>{
常数数据=分辨率数据
const关键字=data.data
log（“第一个索引”，关键字[1]）
this.setState（{kws:keyword}）
}
)}
render（）{
const{kws=[]}=this.state
常量选项={
标题：{
文本：“我的图表”
},
xAxis：{
键入：“日期时间”
},
系列：[{
数据：kws
}]
}
返回(
);
}
}

我想画出这样的东西：

更新：我已将JSON响应更新为如下：

这是一个更好的绘图结构吗？如果是这样的话，我该如何绘制每个关键字及其值，如上图所示

UPDATE2：我已经更新了我的Json文件

---

您需要将数据解析为Highcharts能够识别的正确格式。根据您的更新屏幕，它应该如下所示：

series: [{
  name: 'ps2',
  data: [
    [1579996800, 67],
    [1580601600, 70],
    [1581206400, 68],
    [1581811200, 72],
    etc...
  ]
}, {
  name: 'ps2 emulator',
  data: [
    [1579996800, 59],
    [1580601600, 69],
    [1581206400, 71],
    [1581811200, 63],
    etc...
  ]
}]

---

我想说的是，这个系列的数据不是图表能够理解的正确格式。。。快速浏览一下，您将为数据提供一个对象数组。您的数据也有timestapms键，您可能需要对其进行操作。你看过海图了吗？正确的方法是什么？我可以将JSON响应转换为另一种方式。这样会更好吗？好吧，随着时间的推移，你会采取价格行动。。。需要将序列作为数字序列的数组：[{data:[1，2，3]}]，这是一个很好的例子，说明了数据是如何查找序列的。。。你的和这个不匹配。。。我懂了。所以有这样的数据就行了？？我明白了，所以我正在python上构建JSON响应。要做到这一点，我应该把关键字（ps2，ps2模拟器）作为DF的索引吗？另外，在将df转换为json时，我应该使用jsonify吗？也许我应该问一个不同的问题：D，但这非常有帮助，给了我正确的答案direction@Sundios对不起，我不懂python。我刚刚演示了series对象的外观。更多：嗨，塞巴斯蒂安，谢谢你的帮助。我已经更新了JSON响应。这是high chart绘制结果的正确答案吗？或者DateTime必须像DateTime，value，而不是“DateTime”：value？Sundios你能把这个JSON响应复制/粘贴到我可以测试的某个在线编辑器上吗？谢谢你的帮助Sebastian。这是一个例子。