如何使用 `vis.js` 显示 JSON 数据

Question

我想显示来自 MySQL 和 vis.js 的数据。我使用 JSON 获取数据，但出现此错误：

Error: Node must have an id
  throw new Error("Node must have an id");
  -------^

function tampil()
{
 $.ajax({
  type:"GET",
  cache :false,
  dataType: "json",
  url:"fetch.php",
  success: function(data){
   console.log(data);
   
   var vertex = new vis.DataSet([
       {id:data[0], label:data[1]}
   ]);
   var hubung = new vis.DataSet([
       {from:data[2], to:data[3]}
   ]);
   var myDiv = document.getElementById("media");
   var data = {
    nodes : vertex,
    edges : hubung
   }
   
   var options = {};
   
   var network = new vis.Network(myDiv,data,options);
  }
 });
}

<!DOCTYPE html>
<html>
<head>
 <script type="text/javascript" src="js/vis.js"></script>
 <script type="text/javascript" src="js/jquery-2.1.3.min.js"></script>
 <link rel="stylesheet" type="text/css" href="css/vis.css" />
</head>
<body>
 <button type="button" onclick="tampil()">proses</button>
 <div id="media" style="width:500px;height:500px;"></div>
</body>
</html>

我的服务器是这样的

Answer 1

已解决，在JavaScript我添加了以下代码：

function tampil()
{
 $.ajax({
  type:"GET",
  cache :false,
  dataType: "json",
  url:"nodes.php",
  success: function(data){
   console.log(data);
    
   var vertex = new vis.DataSet();
   var hubung = new vis.DataSet();
   var myDiv = document.getElementById("media");
   var data = {
    nodes : vertex,
    edges : hubung
   }
   
   var options = {};
   
   var network = new vis.Network(myDiv,data,options);
   
   $.getJSON('edges.php', function(edges) {
    hubung.add(edges);
   });
   $.getJSON('nodes.php', function(nodes) {
    vertex.add(nodes);
   });
  }
 });
}

如何使用 `vis.js` 显示 JSON 数据

How to display JSON data with `vis.js`

php

mysql

json

vis.js

vis.js-network