0
我正在使用angularjs Vis.js angular vis.js树形结构的网络图表。我面临的问题是，当孩子与其父母相比有相同或更多的子孩子时，即使箭头指向正确，孩子们也会顶尖。我希望图表能够以原始方式显示。有没有解决这个问题？当我们向子节点添加更多节点时，Vis.js网络树结构混乱起来
为了更清楚地解决这个问题，请看附件中的图片。
在正确的观点图表：
根有4个孩子：C1，C2，C3，C4 C3有3个孩子：一个，两个，三个
直到我添加3名儿童到C3，图表外观对我来说很好。但现在当我添加另一个孩子four C3。
然后图表出现在混乱图表视图中。
我想要的是即使我向C3添加任意数量的孩子，图表外观仍应保留在Correct Chart View图片中。在three节点旁边，应该添加新的four节点。 Root节点应始终显示在顶部，如Correct Chart View中所示。它应该往下走，如图Jumbled Chart View
$scope.graph = {
"options":{
"nodes":{
"borderWidth":1,
"borderWidthSelected":1,
"shape":"box",
"color":{
"border":"lightgray",
"background":"white",
"highlight":{
"border":"lightgray",
"background":"lightblue"
},
"hover":{
"border":"lightgray",
"background":"lightblue"
}
}
},
"edges":{
"smooth":{
"type":"cubicBezier",
"forceDirection":"vertical",
"roundness":1
},
"color":"lightgray"
},
"layout":{
"hierarchical":{
"direction":"UD",
"nodeSpacing":150
}
},
"interaction":{
"dragNodes":false,
"navigationButtons":true
},
"physics":false,
"autoResize":true,
"height":"400"
},
"data":{
"nodes":[
{
"id":"1000",
"label":"Root"
},
{
"id":"1001",
"label":"Ch1"
},
{
"id":"1002",
"label":"Ch2"
},
{
"id":"1003",
"label":"Ch3"
},
{
"id":"57c6eed2a43e6b69cd33251e",
"label":"out"
},
{
"id":"57c6e9c7a43e6b69cd332519",
"label":"abc"
},
{
"id":"57c6e9d4a43e6b69cd33251a",
"label":"xyz"
},
{
"id":"57c6e9dfa43e6b69cd33251b",
"label":"pqr"
},
{
"id":"57c6e9f0a43e6b69cd33251c",
"label":"vpr"
},
{
"id":"57c6f27fa43e6b69cd33251f",
"label":"rjr"
},
{
"id":"57c6eeb3a43e6b69cd33251d",
"label":"gut"
}
],
"edges":[
{
"from":"1000",
"to":"1001",
"arrows":"to",
"parenLabel":"Root",
"childLabel":"Ch1"
},
{
"from":"1000",
"to":"1002",
"arrows":"to",
"parenLabel":"Root",
"childLabel":"Ch2"
},
{
"from":"1000",
"to":"1003",
"arrows":"to",
"parenLabel":"Root",
"childLabel":"Ch3"
},
{
"from":"1000",
"to":"57c6eed2a43e6b69cd33251e",
"arrows":"to",
"parenLabel":"Root",
"childLabel":"out"
},
{
"from":"1001",
"to":"57c6e9c7a43e6b69cd332519",
"arrows":"to",
"parenLabel":"Ch1",
"childLabel":"abc"
},
{
"from":"57c6e9c7a43e6b69cd332519",
"to":"57c6e9d4a43e6b69cd33251a",
"arrows":"to",
"parenLabel":"abc",
"childLabel":"xyz"
},
{
"from":"57c6e9c7a43e6b69cd332519",
"to":"57c6e9dfa43e6b69cd33251b",
"arrows":"to",
"parenLabel":"abc",
"childLabel":"pqr"
},
{
"from":"57c6e9c7a43e6b69cd332519",
"to":"57c6e9f0a43e6b69cd33251c",
"arrows":"to",
"parenLabel":"abc",
"childLabel":"vpr"
},
{
"from":"57c6e9d4a43e6b69cd33251a",
"to":"57c6f27fa43e6b69cd33251f",
"arrows":"to",
"parenLabel":"xyz",
"childLabel":"rjr"
},
{
"from":"57c6e9dfa43e6b69cd33251b",
"to":"57c6eeb3a43e6b69cd33251d",
"arrows":"to",
"parenLabel":"pqr",
"childLabel":"gut"
}
]
}
}
