Vis.js의 노드 레이블 매개 변수 값에 액세스

vis.js 데이터 세트의 노드 레이블 매개 변수 값에 액세스하려고합니다. nodeId에서 var nodeId = params.nodes[0];Vis.js의 노드 레이블 매개 변수 값에 액세스

노드 id = 2에 대한 Label 매개 변수 값에 액세스하려면 어떻게해야합니까? 당신이 정말로 당신이 노드 ID가 1 번부터 순서대로 정수 대회를 따르겠다 보장 할 수있는 경우

// 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];

출처

2017-11-08 Barry Cullen

, 다음, 다음을 클릭 콜백에서와 같이 라벨에 액세스 할 수 있습니다, 질문에 대답합니다 :

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에서 색인되기 때문에 하나가 필요했다 빼면, 그러나 ID는 1에서 시작) 항상 얻기에 너무 의존으로,

그러나, 좋은 코딩 연습되지 않을 것 대회 권리. 노드를 삭제하거나 ID 용 문자열을 사용하는 등의 작업을 시작하면이 규칙을 위반할 수 있습니다.

또 다른 방법은 네트워크 개체에 내부 구조를 사용하는 것입니다. 문제는 사용자 문서에이 내용이 언급되지 않았으므로 다소 위험하므로 향후 버전에서 변경 될 수 있습니다. 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);   
    } 
});

당신은 또한 추가로 다른 데이터 집합 방법에 액세스 할 수 있습니다 같을 것이다 및 업데이트() (예 :

)

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

데이터 집합 및 이러한 방법을 사용하면 당신은 임의의 순서로 노드와 모서리를 입력 할 수 있습니다. 이것은 모두 효율적이어야합니다. 내부적으로, 노드와 에지에 대한 주요 액세스는 배열 색인이 아닌 객체 속성에 대한 참조를 통해 이루어 지므로 액세스가 빨라야합니다. API는 사용자 편의를 위해 배열을 생성하는 경향이 있지만, 복사하는 것만이 아니라 생성하는 것입니다.

네트워크 개체와 별도로 일부 노드 정보를 유지해야하는 것은 사용자 관점에서 보면 다소 어색한 것으로 보입니다. 특히 둘 이상의 네트워크 개체가있는 경우 특히 그렇습니다. 그러나 최소한이 방법은 게시 된 API 만 사용합니다.

출처

2017-11-19 05:24:42 gms

Vis.js의 노드 레이블 매개 변수 값에 액세스

답변

관련 문제