vue-flowy
vue-flowy copied to clipboard
Way to Find out if Node Exists on Map Already & Obtain Existing Node
The Ask
Hi there! I was wondering if it would be possible to place a method in the FlowElement.ts to tell the user whether or not a node exists in the client or not, and another method to return a node if it exists (if not just throw an exception, probably). It could be as simple as
private isRegistered() {
if ( flowElementsById[this.id]) {
return true;
}
return false;
}
private getRegisteredNode(id: number) {
if ( flowElementsById[id]) {
return flowElementsById[id];
}
throw new Exception("You can't do that!");
}
Explanation
I really love this library. Mostly because it was written in TS, but also because it works really well and is extremely simple to use.
Currently I'm dynamically populating a flowchart() element in the mount() method of one of my components by traversing a dictionary of items linked together. I get this dictionary from an outside source and don't have a say in how the data gets delivered.
For example, my dictionary might look like this: 1 => [2, 3] 2 => [6, 7] 3 => [4] 4 => [5]
The resulting tree would look like this:
The fact is though that sometimes these lists can get a little messy, and lines might need to lead to a node that's already been created. In the image shown, for example, what if, instead of 4 mapping to [5], 4 mapped to [5, 7]? Then my recursive method to create nodes and place them on the tree will break, because the node for 7 will have already been created (based on how I am traversing--I think officially my traversal strategy is called a left traversal, basically just going to the leftmost leafnode and working my way from there).
Having a convenience method to let me know if a node has already been created would enable me to forgo the creation of a duplicate node, and the second proposed method would enable me to grab that node if necessary.
This might be unclear, so if you have any questions or need specific code snippets please let me know! Again, fabulous work on this tool.
---- UPDATE ---
I decided to do a workaround just in case. What I tried was maintaining my own collection (map) of nodes keyed off nodeID, and checking my internal map before adding nodes (so basically keeping my own partial copy of flowElementsById).
This....sort of worked. It worked really well for small cases (like my example, above):
But for bigger data sets....well, um...didn't.
This picture might make it hard to tell, but basically it looks like the SVG underlying element starts placing shapes outside of its viewport? I'm not 100% sure on this, and this issue is probably beyond the scope of what's fixable in a short amount of time.
Neverthelss--any idea?