Vis.jsのノードラベルパラメータ値へのアクセス

Question

vis.jsデータセットのノードラベルパラメータ値にアクセスしようとしています。 nodeIdからvar nodeId = params.nodes[0];

ノードID = 2のラベルパラメータの値にアクセスするにはどうすればよいですか？

// create an array with nodes 
var nodes = [ 
    {id: 1, label: 'Node 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'); 
var data = { 
    nodes: nodes, 
    edges: edges 
}; 


network.on("click", function (params) { 

    if (params.nodes.length > 0) { 

     var nodeId = params.nodes[0]; 

Answer 1

あなたは本当にあなたが質問に答えるために、そして、1から始まり、そのノードIDが順に整数である規則に従うだろうことを保証することができる場合、あなたは以下のクリックコールバックのようにラベルにアクセスできます。

network.on("click", function(params) { // NOT RECOMMENDED 
    if (params.nodes.length > 0) { 
     var nodeId = params.nodes[0]; 
     console.log("Clicked on a NODE with id = " + nodeId + ", label = " + 
      nodes[nodeId - 1].label);   
    } 
}); 

（配列は0からインデックスが作成されているので、1が必要であった引くことが、IDは1から始まります）、それは常に取得に依存しすぎているとして、

しかし、それは良いコーディングプラクティスではありません大会の権利。ノードを削除する、idsのために文字列を使用するなどの操作を開始すると、この規約が破綻する可能性があります。

もう1つの方法は、ネットワークオブジェクトに内部構造を使用することです。問題は、ユーザーのドキュメントにはこれが言及されていないため、やや危険です。将来のバージョンでは変更される可能性があります。 vis.js.のユーザーのために文書化されていないネットワークオブジェクトからノードとエッジ情報を取得し、私の知る限りでは

console.log("..Or, using undocumented internal structure, node label = " + 
    this.body.nodes[nodeId].options.label); 

：内部構造にチャンスをうかがっ、私はあなたが以下のように使用することができましたグラフアルゴリズムを使用する場合、ノードとエッジは重要なオブジェクトですが、文書化されていない隠し内部オブジェクトです。だから、私たちは悪いコーディングの練習と見なされるかもしれないいくつかのリスクを取る。

vis.jsの推奨される方法は、ノードをvis.DataSetにすることです。あなたはすでにエッジをvis.DataSetにしました - なぜノードもありませんか？

次に、（）ノードの仕様は

var nodes = new vis.DataSet([ 
    {id: 1, label: 'Node 1'}, 
    {id: 2, label: 'Node 2'}, 
    {id: 3, label: 'Node 3'}, 
    {id: 4, label: 'Node 4'}, 
    {id: 5, label: 'Node 5'} 
]); 

のように見えるとラベルを示すクリックコールバックは

network.on("click", function(params) { 
    if (params.nodes.length > 0) { 
     var nodeId = params.nodes[0]; 
     console.log("Clicked on a NODE with id = " + nodeId + ", label = " + 
      nodes.get(nodeId).label);   
    } 
}); 

ます。また、このような追加などの他のDataSetメソッドにアクセスする必要がありますようになります。 update（）は、たとえば

nodes.add({id: 6, label: 'Node 6'}); 
nodes.update({id: 6, label: "Modified node 6", newVar: "A new property"}); 

などのデータセットを使用すると、これらのメソッドを使用すると整数や文字列を含む任意のIDに対して、任意の順序でノードとエッジを入力することができます。これはすべて効率的でなければなりません。内部的には、ノードやエッジへのキーアクセスは、オブジェクトのプロパティへの参照であり、配列のインデックス化ではないため、アクセスが高速になるようです。 APIはユーザーの利便性のために配列を生成する傾向がありますが、コピーするだけでなく、生成します。

ネットワークオブジェクトとは別にいくつかのノード情報を維持することは、特に複数のネットワークオブジェクトが存在する場合、ユーザーの観点からはやや厄介なようです。しかし、少なくともこのアプローチでは、公開されたAPIのみを使用します。