Алгоритм позиционирования узла Sigma JS - PullRequest
0 голосов
/ 29 марта 2020

Я пытаюсь создать визуальный график точек в удобочитаемом и не запутанном виде, у меня есть идентификаторы, которые представляют узлы, и контакт, который представляет дочерние узлы родительского узла.

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

мой код пока таков: (не обращайте внимания на значение cx, cy как то, где я застрял)

var json_data = JSON.parse('[{"id":1,"contact":[{"id":2,"contact":[{"id":5},{"id":6},{"id":7}]},{"id":3,"contact":[{"id":8},{"id":9},{"id":10}]},{"id":4,"contact":[{"id":11},{"id":12},{"id":13}]}]}]');

var g = {
      nodes: [],
      edges: []
    };

var gx = 0, gy = 0;

processLevel(json_data, gx, gy);

function processLevel(data, cx, cy, parent = null) {

    console.log("Function Called: data length = " +  data.length);

    console.log("cy = " +  cy);

    for(var x = 0; x < data.length; x++){

        console.log(data[x].id);
        cx = x;
        console.log("cx = " +  cx);

        g.nodes.push({
            id: 'n' + data[x].id,
            label: 'Node ' + data[x].id,
            x: cx*cy,
            y: cy,
            size: 1,
            color: '#FF2D00'
        });

        if(parent) {
            g.edges.push({
                id: 'e-' + parent + '-' + data[x].id,
                source: 'n' + parent,
                target: 'n' + data[x].id,
                size: 1,
                color: '#000'
            });
        }

        if(typeof data[x].contact !== 'undefined') {
            cy++;
            processLevel(data[x].contact, cx, cy, data[x].id);
        } 
    }
}



// Instantiate sigma:
s = new sigma({
  graph: g,
  container: 'graph-container'
});

желаемый результат будет примерно таким:

enter image description here

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...