JSFiddle - React, Tailwind, and code Playground

by Евгений Дзюба

HTML

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

CSS

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

JavaScript

var chart = new OrgChart(document.getElementById("tree"), {
  mouseScrool: OrgChart.action.none,
            nodeBinding: {
                field_0: "name"
            },
            nodes: [
                { id: 1, name: "Мама" },
                { id: 2, pid: 1, name: "Син"},
                { id: 3, pid: 1, name: "Дочь" }
            ]
        });