Можно выделить найденный при поиске узел - Оргчарт

Question

Можно ли выделить узел, найденный при поиске, чтобы просто отобразить на нем анимированный эффект? Выберите найденный узел, чтобы получить точку доступа для узла и отобразить на ней эффект.

Answer 1

Ты можешь использовать

chart.center(nodeId);

или же

chart.ripple(nodeId);

Вот пример:

var chart = new OrgChart(document.getElementById("tree"), {
            nodeBinding: {
                field_0: "name",
                field_1: "id"
            },
            nodes: [
                { id: 1, name: "Amber McKenzie" },
                { id: 2, pid: 1, name: "Ava Field" },
                { id: 3, pid: 1, name: "Peter Stevens" }
            ]
        });
        
document.getElementById("center").addEventListener("click", function(){
  chart.center(3);
});

document.getElementById("ripple").addEventListener("click", function(){
  chart.ripple(3);
});

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

#center{
  position: absolute;
  top: 40px;
  right: 40px;
  font-size: 30px;
  width: 140px;
  z-index: 5000;
}

#ripple{
  position: absolute;
  top: 90px;
  right: 40px;
  font-size: 30px;
  width: 140px;
  z-index: 5000;
}

<script src="https://balkangraph.com/js/latest/OrgChart.js"></script>
<button id="center">center(3)</button>
<button id="ripple">ripple(3)</button>
<div id="tree"/>