Javascript 使用ajax响应在html表上绘制json数据

这是示例json：

[
  {
    "datetime": "2020-07-01T00:00:00",
    "params": [
      {
        "parameterName": "Temperature",
        "value": 20,
        "color": "Green"
      },
      {
        "parameterName": "PH Level",
        "value": 86,
        "color": "Green"
      },
      {
        "parameterName": "Partical Level",
        "value": 2,
        "color": "Green"
      },
      {
        "parameterName": "Oxygen Level",
        "value": 8897,
        "color": "Green"
      },
      {
        "parameterName": "Salinity",
        "value": 8849,
        "color": "Green"
      }
    ]
  },
  {
    "datetime": "2020-07-01T01:00:00",
    "params": [
      {
        "parameterName": "Temperature",
        "value": 21,
        "color": "Green"
      },
      {
        "parameterName": "PH Level",
        "value": 85,
        "color": "Green"
      },
      {
        "parameterName": "Partical Level",
        "value": 3,
        "color": "Green"
      },
      {
        "parameterName": "Oxygen Level",
        "value": 8895,
        "color": "Green"
      },
      {
        "parameterName": "Salinity",
        "value": 8847,
        "color": "Green"
      }
    ]
  }
]

现在我需要将此json转换为html数据表，该表应如下所示：

date                | Temperature | PH Level | Partical Level | Oxygen Level | Salinity
2020-07-01T00:00:00 | 20          | 86       | 2              | 8897         | 8849

搜索和其他事情由javascript处理，我需要的是结构，其中datetime将是行，列名将是parameterName属性。一句话，表应该是这样的

//这些用于将参数项更改为简单的键值对对象
功能简化（obj）{
设newobj={}；
newobj[obj.parameterName]=obj.value；
返回newobj；
} 
//它们使用简化的键值对来创建行对象
函数makeRow（obj）{
让newobj={datetime:JsonResponse.datetime}
//JsonResponse是您的响应
JsonResponse.params.foreach（函数（项）{
newobj={…newobj，…简化（项）}；
} ) ;
返回newobj；
} 
//扁平物体
让NewJson=JsonResponse.map（函数（项）{
返回makeRow（项目）
} ) ;

困难的部分到此结束 NewJson应该是扁平对象，您可以使用它来使用javascript填充表