我正在尝试使用ReactJS从 JSON文件绘制 ER图。我有一个文件，可以在其中查看表及其之间的关系（对象中的“关系”）。就像数据库一样，带有对象。

如何使用ReactJS创建这样的ER图或Scheme？我没有设法将Storm Diagrams用作初学者，也不知道它的外观。

JSON对象在每个表中都包含表，例如任务，用户，注释以及它们之间的关系（用于外键）。我想要一种显示数据库表并从JSON对象呈现它们的方法。 这是我的JSON对象：

  "tasks": {
    "columns": [
      "id","name","task_type","organization_id","documentation","created_at"
    ],"relations": []
  },"users": {
    "columns": [
      "id","permissions","user_tasks": {
    "columns": [
      "id","user_id","task_id","relations": [
      [
        "user_id","users","id"
      ],[
        "task_id","tasks","id"
      ]
    ]
  },"data": {
    "columns": [
      "id","metadata_id","sha256","file_name","audio_data_type_id","relations": [
      [
        "metadata_id","data_metadata",[
        "audio_data_type_id","audio_data_types","tasks_data": {
    "columns": [
      "id","data_id","priority","relations": [
      [
        "task_id",[
        "data_id","data","data_metadata": {
    "columns": [
      "id","country","region","primary_language","annotation_types": {
    "columns": [
      "id","created_by","objective_name","label_name","deleted_at","created_at","value_type"
    ],"relations": [
      [
        "created_by","audio_data_types": {
    "columns": [
      "id","bit_width","channels","encoding","sampling_rate"
    ],"audio_annotations": {
    "columns": [
      "id","root_id","child_id","parent_id","annotation_type_id","value","confidence","speaker","start_time","stop_time"
    ],[
        "created_by",[
        "annotation_type_id","annotation_types","id"
      ]
    ]
  }
}