Как визуализировать дочернюю структуру дочернего дерева динамически хранимых данных, используя Underscore.Burrow? - PullRequest
Новая
       8

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

0 голосов
/ 03 мая 2019

Я хотел отобразить иерархию контейнера-паллета-пакета-продукта, используя D3. И использовал функцию underscore.burrow, чтобы вкладывать данные произвольной глубины. Данные были получены из Blockchain (MetaCoin - Contract) 

function newFun() {
        MetaCoin.deployed().then(function (instance) {  
            instance.getDatafromBC.call(gid1).then(function (v) {  //function call 
                if (flg.length == 0) {  //flg is the no. of levels in the heirarchy
                    flg = v[6];
                }
                var nd   = new Array();
                nd.id    = v[0].c;
                nd.nodes = v[5].c;
                nd.flag  = v[6];
         flatData = Array.prototype.concat.apply([nd],[flatData]);  // input data from Blockchain
                console.log(flatData);
                gid1 = v[5].c;
                if (v[5].c == 0) {
                   nd.nodes = null;

                   if (flg == 3) {   
               /*flg=3, points out final level (product), 
                 flg=2 second last level (package),
                 flg=1 second level (pallette),
                 flg=0 top level (container)*/
                   document.getElementById("sh").style.display = "none";
                   document.getElementById("chart").style.display = "block";
                   document.getElementById("drop").style.display = "none";
                   document.getElementById("hint").style.display = "none";
                   document.getElementById("getprod").style.display = "none";
                   App.treeHierarchy(flatData);
                    }
                    if (flg == 2 || flg == 1 || flg == 0) {
                        childFunction(flatData, flg, gid);  //Function for searching Child of each ancestor or node. 
                    }
                } else {
                    newFun();
                }
            });
        }).catch(function (e) { });
    } //newFun

D3 используется для визуализации данных 

var svg = d3.select("#chart").append("svg")
        .attr("width", width + margin.right + margin.left)
        .attr("height", height + margin.top + margin.bottom)
        .append("g")
        .attr("transform", "translate(" +
         margin.left + "," + margin.top + ")");
        var treeData = _.burrow(flatData);  // using _.burrow() for nesting       
        root = d3.hierarchy(treeData, function (d) {
        return d.children;
    });

[ Контейнер становится корнем, а все остальные становятся его единственным потомком. Это не имеет смысла, в то время как контейнер становится предком паллеты, палитра становится предком упаковки, а упаковка становится предком продукта (Контейнер-> Паллет-> Упаковка-> Продукт).

Это правильная структура дерева. Но эта логика не позволяла включать гнездовые данные произвольной глубины. Вот почему я превратился в нору. Но все же я сталкиваюсь с проблемами на этом.

...