nodeContent: accept a function that returns either HTMLElement or string

[Maximaximum]

Is your feature request related to a problem? Please describe. It would be great if the nodeContent() method accepted a function returning an HTMLElement instead of string.

One of the problems with returning a string is that you can't pass any state into the instantiated element except for its attributes. However, passing data via attributes is quite limiting, because you can only pass serializable data. Scenarios where passing data by reference is important are unavailable.

Describe the solution you'd like It would be great if both scenarios worked:

The currently working scenario:

chart.nodeContent(n => `<app-node node="${JSON.stringify(n)}"></app-node>`)

The new suggested scenario:

chart.nodeContent(n => {
  const el = document.createElement(selector);
  el.node = n;
  return el;
})

Describe alternatives you've considered Passing data via html attributes. This approach, however, does not work if you want to pass non-serializable data, like an object reference.

---

[Maximaximum]

I guess that in order to implement this, you would have to use selection.append() instead of selection.html() on https://github.com/bumbeishvili/org-chart/blob/master/src/d3-org-chart.js#L1096

[bumbeishvili]

There is onNodeUpdate method where you can do anything with javascript (including having dynamic animated nodes)

Take a look at interactive node example here - https://stackblitz.com/edit/js-fc2rrs?file=index.html

https://github.com/bumbeishvili/org-chart/tree/dev#features

Within that function this refers to current dom element

[Maximaximum]

I'm not sure what you mean, but I guess we're talking about different things.

Can onNodeUpdate help me retain the internal state of the node element between different nodeContent callback calls?

I'm asking because I'm trying to use an Angular component compiled into a custom element using Angular Elements. The problem is that I'd love to be able to pass the whole HierarchyNode object to my custom component's input, but there's no way to do that while using nodeContent(), because the callback it accepts has to return an html string, which means that the HierarchyNode object would have to be serialized.

[bumbeishvili]

Check out following issues

https://github.com/bumbeishvili/org-chart/issues/115 https://github.com/bumbeishvili/org-chart/issues/97

It might help you, I personally have no idea how to do that

[Maximaximum]

@bumbeishvili Yeah, I guess this issue is just a duplicate of https://github.com/bumbeishvili/org-chart/issues/97

Closing this, thank you!