我使用vis.js顯示二叉樹。我擁有關於數據庫的所有信息，並按照我試圖將它複製到我的需求而沒有結果的文檔。使用查詢結果中的vis.js
，我使用的文檔是：
<style type="text/css"> #mynetwork { width: 600px; height: 400px; border: 1px solid lightgray; } </style> </head> <body> <div id="mynetwork"></div>//創建節點的數組 變種節點=新vis.DataSet（[{ ID：1，標籤：'節點1'}， {id：2，label：'Node 2'}， {id：3，label：'Node 3'}， {id：4，label：'Node 4'}， {id：5，label：'Node 5'} ]）;
// create an array with edges var edges = new vis.DataSet([ {from: 1, to: 3}, {from: 1, to: 2}, {from: 2, to: 4}, {from: 2, to: 5} ]); // create a network var container = document.getElementById('mynetwork'); // provide the data in the vis format var data = { nodes: nodes, edges: edges }; var options = {}; // initialize your network! var network = new vis.Network(container, data, options); </script> </body> </html>
居住的地方工作得很好，但是當我改變，它看起來像這樣：
褐VA LA畫報$阿賈克斯（{頭：{'X-CSRF- TOKEN'： $（'meta [name =「csrf-token」]'）。attr（'content'）}，
url：「obtenerNodos」， data：{id：'1'}， method： 'post'， 成功：function（data）{ console.log（data）; ///////////////////////////////////////////console.log(data[0]); //var res = JSON.parse(data); var res = data.split('"*"'); var nd = res[0]; var gd = res[1]; //console.log(nd);/////////////////////////////////////// console.log(nd); var nodes = new vis.DataSet(nd); var edges = new vis.DataSet(gd); // create a network var container = document.getElementById('mynetwork'); // provide the data in the vis format var data = { nodes: nodes, edges: edges }; console.log(nodes);/////////////////////////////////////// //console.log(nd); var options = { nodes:{ borderWidth: 1, borderWidthSelected: 2, brokenImage:'http://binario.com/admin/img/profile1.jpg', color: { border: '#2B7CE9', background: '#97C2FC' }, font: { color: '#343434', size: 14, // px face: 'arial', background: 'none', strokeWidth: 0, // px strokeColor: '#ffffff', align: 'center', multi: false, vadjust: 0, bold: { color: '#343434', size: 14, // px face: 'arial', vadjust: 0, mod: 'bold' }, ital: { color: '#343434', size: 14, // px face: 'arial', vadjust: 0, mod: 'italic', }, boldital: { color: '#343434', size: 14, // px face: 'arial', vadjust: 0, mod: 'bold italic' }, mono: { color: '#343434', size: 15, // px face: 'courier new', vadjust: 2, mod: '' }, }, heightConstraint: false, hidden: false, image: 'http://binario.com/admin/img/profile1.jpg', level: undefined, shape: 'circularImage', size: 25, //title: undefined, //value: undefined, widthConstraint: false }, edges:{ arrows: { to: {enabled: true, scaleFactor:1, type:'arrow'}, middle: {enabled: true, scaleFactor:1, type:'arrow'}, from: {enabled: true, scaleFactor:1, type:'arrow'} }, color: { color:'#161616', highlight:'#848484', hover: '#848484', inherit: 'from', opacity:1.0 } }, layout: { randomSeed: undefined, improvedLayout:true, hierarchical: { enabled:true, levelSeparation: 150, nodeSpacing: 100, treeSpacing: 200, blockShifting: true, edgeMinimization: false, parentCentralization: true, direction: 'UD', // UD, DU, LR, RL sortMethod: 'directed' // hubsize, directed } } }; // initialize your network! var network = new vis.Network(container, data, options); //do something },error: function(xhr, ajaxOptions, thrownError){ console.log(xhr.status+" ,"+" "+ajaxOptions+", "+thrownError); } });
當控制檯告訴我 「的console.log（數據）;」，我得到這個：
{ID：1，標籤： 'Carlos Corrales'}，{id：2，label：'Carlos Jaramillo'}，{id：3，label：'Carlos Jaramillo Corra LES'} 「*」{由：1， 到：2}，{從：1，：3}
當控制檯告訴我 「的console.log（ND）;」，我得到此：
{ID：1，標籤： '卡洛斯科拉萊斯'}，{ID：2，標籤： '卡洛斯 賈拉米洛'}，{ID：3，標籤： '卡洛斯賈拉米洛科拉萊斯'}
我很好，但是當控制檯顯示「控制檯。日誌（節點）; 「我得到這個：
N {_options：」{ID：1，標籤： '卡洛斯·科拉萊斯'}，{ID：2，標籤： '... LLO'}，{ ID：3，標籤：'Carlos Jaramillo Corrales'}「，_data：{...}， 長度：0，_fieldId：」id「，_type：{...}，...}長度：0 _data： proto：構造：ƒ對象（）hasOwnProperty：ƒhasOwnProperty（）isPrototypeOf：ƒisPrototypeOf（） propertyIsEnumerable：ƒpropertyIsEnumerable（）的toLocaleString：ƒ 的toLocaleString（）的toString：ƒ的toString（）的valueOf：ƒ的valueOf（） defineGetter ：ƒdefineGetter（） defineSetter：ƒdefineSetter（） lookupGetter：ƒlookupGetter（） lookupSetter：ƒlookupSetter（）得到原：ƒ原（ ）set proto：ƒproto（） _fieldId：「id」 _options：「{id：1，label：'Carlos Corrales'}，{id：2，label：'Carlos Jaramillo'}，{id：3，label：'Carlos Jaramillo Corrales'}」 _subscribers：{add：陣列（1），更新：陣列（1），刪除：陣列（1）} _type： 原：對象 原：對象
所以這是說THA節點數組的長度是0.
我用來獲取數據的代碼是：
個公共職能obtenerNodos（請求$要求）{
$id = $request->id; $nodos = ""; $edges = ""; $senal = 0; //while ($senal == 0) //{ $res = panelController::getNodos($id); $valores = explode("**",$res); $nodos .= $valores[0]; if($valores[1] != "-99"){ $edges .= $valores[2]; $nodos .= ",".$valores[3]; } if($valores[4] != "-99"){ $edges .= ",".$valores[5]; $nodos .= ",".$valores[6]; } //$senal = 1; //} $nodos .= ""; $edges .= ""; //return $edges; $regreso = $nodos.'"*"'.$edges; return $regreso; }
所以問題是數據不進入節點和恩格斯陣列中，這樣，我不能得到的圖形。
