Show tooltip against node clicked

[RMamoon]

I wanted to show popup or tooltip on nodeclick, and for this i used onNodeClick event. But for popup to show exactly near to clicked node i need to get exact coordinates (top, left, X,Y) of clicked node so that i can achieve my goal. How to get these parameters in onNodeClick function?

[bumbeishvili]

You can access DOM element in nodeUpdate method (use this) and then you can attach additional events and tips to it

[RMamoon]

chart = new d3.OrgChart() .container('.chart-container') .data(dataFlattened) .nodeWidth((d) => 250) .initialZoom(0.7) .nodeHeight((d) => 175) .onNodeClick( (d) => showPopup (d ) ) .nodeContent(function (d, i, arr, state) { }) .render();

function showPopup(node) { console.log(node); }

here in node can i get its coordinates?? as like its other properties (i.e nodeID, imgURl e.t.c)?

[bumbeishvili]

I don't understand your question but suppose you have a function that binds popup to node function show popup(node)

function attachPopup(node){
  d3.select(node).on('mouseenter',d=>console.log(node)
}

// You'd want to use this function in the following way

chart = new d3.OrgChart()
...  // Some other settings 
.container('.chart-container')
...
.onNodeUpdate(function(){
   attachPopup(this)
})
...
.render();