Show / Hide Table of Contents

How to create a Org Chart JS programmatically

There are number of ways to create Org Chart JS programmatically

Using add function

Here is an example:

 
    chart.add({ id: 1, name: "Denny Curtis", title: "CEO" });
    chart.add({ id: 2, pid: 1, name: "Ashley Barnett", title: "Sales Manager" });
    chart.draw(OrgChart.action.init);

If you call draw function with OrgChart.action.init it will draw the chart based on scaleInitial and will center the graph

Using addNode function

If you add a node using addNode you will not need to call draw function

 
    chart.addNode(n);

Using update function

 
    chart.update({ id: 4, pid: 2, name: "Updated Name", title: "Updated Title" });
    chart.update({ id: 1, name: "Updated Name", title: "Updated Title" });
    chart.draw();

Using updateNode function

 
    chart.updateNode({ id: 4, pid: 2, name: "Updated Name", title: "Updated Title" });

Using remove function

 
   chart.remove(2);
   chart.draw();

Using removeNode function

 
   chart.removeNode(2);