我想使用D3显示容器-托盘-包装-产品的层次结构。并在其中使用了underscore.burrow功能来嵌套任意深度的数据。数据已从区块链(MetaCoin-合约)中获取
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;
});