Partner - OrgChart JS | BALKANGraph

This demo shows you how you can add a Partner. author(s): BALKAN Software Plamen Peshev

by Serhii Matrunchyk

HTML

<script src="https://balkangraph.com/js/latest/OrgChart.js"></script>

<div id="tree"></div>

CSS

html, body {
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    font-family: Helvetica;
}

#tree {
    width: 100%;
    height: 100%;
}

JavaScript

window.onload = function() {
		OrgChart.templates.hiddenTemplate = Object.assign({}, OrgChart.templates.ana);
    OrgChart.templates.hiddenTemplate.size = [0, 0];
    OrgChart.templates.hiddenTemplate.node = '';
    OrgChart.templates.hiddenTemplate.plus = '';
    OrgChart.templates.hiddenTemplate.minus = '';

    OrgChart.templates.rootTemplate = Object.assign({}, OrgChart.templates.ana);
    OrgChart.templates.rootTemplate.link = '';
    
  var chart = new OrgChart(document.getElementById("tree"), {
    enableDragDrop: true,
    /* slinks: [
                {from: 9, to: 8, label: 'partner cannot have two "pid"s. One pid=2.'}, 
    ], */
    tags: {
      "partner": {
        template: "ula"
      },
      "proband": {
        template: "isla"
      },
      hiddenRoot: { template: 'hiddenTemplate' },
      root: { template: 'rootTemplate' }
    },
    nodeBinding: {
      field_0: "_name",
      field_1: "id",
    },
    nodes: [{
        "tags": [
          "parent",
          "proband"
        ],
        "pid": 2,
        "id": 1,
        "order": 1,
        "_name": "Serhii Matrunchyk",
        "ppid": 8
      },
      {
        "tags": [
          "parent"
        ],
        "pid": 3,
        "id": 2,
        "order": 2,
        "_name": "My Father",
        "ppid": 4
      },
      {
        "tags": [
          "root"
        ],

        "id": 3,
        "order": 3,
        "pid": 19,
        "_name": "Father's Father",
      },
      {
        "tags": [
          "partner"
        ],
        "pid": 3,
        "id": 4,
        "order": 4,
        "_name": "Father's Mother",
      },
      {
        "tags": [
          "parent"
        ],
        "pid": 3,
        "id": 5,
        "order": 5,
        "_name": "Father's Brother",
        "ppid": 4
      },
      {
        "tags": [
          "parent"
        ],
        "pid": 3,
        "id": 6,
        "order": 6,
        "_name": "Father's Sister",
        "ppid": 4
      },
      {
        "tags": [
    ...