Получить координаты узлов отображаемого графика в Sigma.js

Question

Возможно ли получить координаты узлов графика после его визуализации SigmaJS?

var sigma = require('sigma'); 
var i, 
    s, 
    N = 100, 
    E = 500, 
    g = { 
     nodes: [], 
     edges: [] 
    }; 

// Generate a random graph: 
for (i = 0; i < N; i++) 
    g.nodes.push({ 
     id: 'n' + i, 
     label: 'Node ' + i, 
     x: Math.random(), 
     y: Math.random(), 
     size: Math.random(), 
     color: '#666' 
    }); 

for (i = 0; i < E; i++) 
    g.edges.push({ 
     id: 'e' + i, 
     source: 'n' + (Math.random() * N | 0), 
     target: 'n' + (Math.random() * N | 0), 
     size: Math.random(), 
     color: '#ccc' 
    }); 
sigma.renderers.def = sigma.renderers.canvas; 
// Instantiate sigma: 
s = new sigma({ 
    graph: g, 
    container: document.getElementById('sigma-container'), 
    type: 'canvas' 
}); 

Я хочу, чтобы получить реальные координаты (x с и y ы) узлов в этом графе. (после этого наносится на него атлас силы)

Answer 1

Вы можете получить реальные координаты узлов на некоторых событиях, таких как событие «clickNode». Вот пример кода для получения реальных координат при событии щелчка узла.

s.bind('clickNode', function(e) { 
 
     console.log(e.data.captor); 
 
     /* result : { x:-333, y:-138, clientX:363, clientY:262, ctrlKey:false, isDragging:false, metaKey:false, shiftKey:false} */ 
 
});

В аргументе «е» прошел в clickNode функции, вы можете получить данные ограничены для конкретного узла, а также данные, связанные с событием нажмите на холсте.

Edit:

Попробуйте использовать внешний файл JSON и использовать Сигмы внешний JSON парсер sigma.parsers.json.js. Это обеспечивает функцию функции обратного вызова, где вы можете получить все реальные координаты узлов. Найдите приведенный ниже код.

/*include plugins/sigma.parsers.json/sigma.parsers.json.js */ 
 
sigma.parsers.json('yourjsonfile.json', { 
 
    container: 'sigma-container', 
 
    type: 'canvas' 
 
    },  
 
    function(s){  
 
    s.graph.nodes().forEach(function(s) { 
 
    console.log(s); //result: "read_cam0:x" => x-coordinate ,"read_cam0:y" => y-coordinate  
 
    });} 
 
);

Как и в событиях, в обратном вызове, вы можете получить данные о узле на холсте и данных ограничены к узлу.