OrgChart JS Documentation

Partner/s

You can specify one or more Partner/s of a node by setting their tag to partner, left-partner or right-partner

Here is an example:

 
    var chart = new OrgChart(document.getElementById("tree"), {
        ...
        nodes: [
            ...
            {id: 2, pid: 1, tags: ['partner']},
        ]
    }); 
 

If you want to set partner on the left hand side use left-partner tag instead

 
    var chart = new OrgChart(document.getElementById("tree"), {
        ...
        nodes: [
            ...
            {id: 2, pid: 1, tags: ['left-partner']},
        ]
    }); 
 

Also you can specify multiple partners

 
    var chart = new OrgChart(document.getElementById("tree"), {
        ...
        nodes: [
            ...
            {id: 4, pid: 1, tags: ['partner']},					
            {id: 5, pid: 1, tags: ['partner']},
            {id: 6, pid: 1, tags: ['partner']},
            {id: 7, pid: 1, tags: ['partner']}
        ]
    }); 
 

Children can have parent id pid and parent partner id ppid

 
    var chart = new OrgChart(document.getElementById("tree"), {
        ...
        nodes: [
            {id: 1},
            {id: 2, pid: 1, tags: ['partner']},					
            {id: 3, pid: 1, tags: ['partner']},
            {id: 4, pid: 1, ppid: 2},
            {id: 5, pid: 1, ppid: 3}
        ]
    }); 
 

Using render-link event in partners to add a link icon

 
    var chart = new OrgChart(document.getElementById("tree"), {
        ...
    }); 

    chart.on('render-link', function(sender, args){
       if (args.cnode.ppid != undefined){
            args.html += '<use xlink:href="#heart" x="'+ args.p.xa +'" y="'+ args.p.ya +'" />'
       }
    });
 

Here is more coplex scenario

Partner node/s are very useful for family trees, see Royal Family Tree demo.