我有几个问题。
1)如何更新现有节点的主题/颜色/外观?我很乐意更新配置,然后重新绘制整个图表(但orgChart.draw()似乎不起作用)。
2)关于拖放,启用后,在另一个节点上的拖放不会执行任何操作。我是否可以引用某个函数,例如将拖放的节点“移动”到其拖放到的节点上?
3)启用拖放功能后,将禁用操作按钮(编辑节点,删除节点,添加子节点)。
谢谢!
答案 0 :(得分:0)
您可以使用BALKANGraph插入来实现所需的功能
1)参见下面的示例:
2)和3)无需任何修改即可工作
var chart = new OrgChart(document.getElementById("tree"), {
template: "ana",
nodeBinding: {
field_0: "name",
img_0: "img"
},
links: [
{ from: "2", to: "1" },
{ from: "3", to: "1" }
],
nodes: [
{ id: "1", name: "Plamen Peshev", img: "//balkangraph.com/js/img/empty-img-blue.svg" },
{ id: "2", name: "Ava Field", img: "//balkangraph.com/js/img/empty-img-blue.svg" },
{ id: "3", name: "Rhys Harper", img: "//balkangraph.com/js/img/empty-img-blue.svg" }
]
});
document.getElementById("changeTemplate").addEventListener("click", function () {
chart.config.nodes["1"].tags = ["ula-template"];
chart.config.tags["ula-template"] = { template: "ula" };
chart.draw(false);
});
html, body {
margin: 0px;
padding: 0px;
width: 100%;
height: 100%;
overflow: hidden;
font-family: Helvetica;
}
#tree {
width: 100%;
height: 100%;
}
#changeTemplate{
font-size: 24px;
}
<script src="https://balkangraph.com/js/latest/OrgChart.js"></script>
<button id="changeTemplate">Change the template of node 1</button>
<div id="tree"></div>