OrgChart-修改节点并添加子级-使用jquery

Question

我是在参考以下问题时问这个问题：LINK

这是上面链接的代码：

var datascource = {
      'id': 1,
      'name': 'Lao Lao',
      'title': 'general manager',
      'children': [
        { 'id':2,'name': 'Bo Miao', 'title': 'department manager' },
        { 'id':3,'name': 'Su Miao', 'title': 'department manager'},
        { 'id':4,'name': 'Hong Miao', 'title': 'department manager' },
        { 'id':5,'name': 'Chun Miao', 'title': 'department manager' }
      ]
    };

    $('#chart-container').orgchart({
      'visibleLevel': 2,
      'pan': true,
      'data' : datascource,
      'nodeContent': 'title',
      'nodeId':'id',
      'createNode': function($node, data) {
        $node.on('click', function(event) {
          $('#chart-container').orgchart('addChildren', $node,
            {'id' : 7,  'name': 'Hong ', 'title': 'Test manager' }
          );
        });
      }
    });

请告诉我如何向节点（＃node-2）添加更多数据，如下图所示

以便在同一＃node-2中存在
1.红苗
2.部门经理
3.ABC（示例文字）

编辑：我已经看过以下链接，它们没有共享代码：
1。Add customized node in OrgChart using orgchart.js
2。 https://github.com/dabeng/OrgChart
但无法得到我的答案。  请告诉我代码，如上面的图像和紧随其后的所列文本中所述，如何在节点本身内添加级别。

Answer 1

您可以在数据源中添加新属性并实现nodeTemplate：

var datascource = {
'id': 1,
'name': 'Lao Lao',
'title': 'general manager',
'office': '',
'children': [
{ 'id':2,'name': 'Bo Miao', 'title': 'department manager','office': ''},
{ 'id':3,'name': 'Su Miao', 'title': 'department manager','office': ''},
{ 'id':4,'name': 'Hong Miao', 'title': 'department manager','office': 'Data'},
{ 'id':5,'name': 'Chun Miao', 'title': 'department manager''office': ''}
]
};
var nodeTemplate = function(data) {
return `
<div class="title">${data.name}</div>
<div class="content">${data.title}</div>
<div class="content office">${data.office}</div>
`;
};
$('#chart-container').orgchart({
'visibleLevel': 2,
'pan': true,
'data' : datascource,
'nodeContent': 'title',
'nodeTemplate': nodeTemplate,
'nodeId':'id'
});

更多信息：

https://rawgit.com/dabeng/OrgChart/master/demo/custom-template.html