dash14 / v-network-graph

An interactive network graph visualization component for Vue 3

Home Page:https://dash14.github.io/v-network-graph/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Any advice for physic rendering?

kogratte opened this issue · comments

Hello!

This is not an issue nor a request, moreover a request for advice.

I was using until now a lib named vis-network, which was working pretty well but was hard to manage, and nearly impossible to customize.

This latest reason is the one who make me switch to v-network-graph. Anyway, I'm used to the barnesHut physic model, which is... way more efficient than the one you provides as example in documentation.

From what I understand, this is not an issue tied to this lib itself, as you rely on third party implementations. What I would like to know, is which kind of graph libs you may have seen with v-network-graph, and which one offer the best results.

What I want to achieve is a dynamic map (interactive), where the user is able to add links (aka edges) between nodes in order to design a network topology.

You'll find examples in attachement.

From what I see for the time being, the provided example is very bad and results are ugly. There is no mass vector nor any repulsion attributes, which makes things very difficult to customize.
Screenshot 2023-09-05 at 16 46 01
Screenshot 2023-09-05 at 16 46 14

Hi @kogratte,
Thank you for using v-network-graph library!

What I would like to know, is which kind of graph libs you may have seen with v-network-graph, and which one offer the best results.

Unfortunately, I have not seen many v-network-graphs used in combination with other graph libs, so I cannot give an adequate answer.
Sorry I can't help you....

Fair enough :) Then I'll need to do it by myself.
FTR, the goal is to use https://github.com/visjs/vis-network/blob/master/lib/network/modules/PhysicsEngine.js.

I have a similar use case, would be great if you could share your discoveries 👍 @kogratte

For the record, I've not been able to deep dive into the implementation, both cause of ROI, available time and motivation (once faced the amount of work it represents). I stick to what is available, including drawbacks.

BUT.

Those drawbacks has been solvable. I finally have a solution working well with this lib.

https://youtu.be/Z_4lmFfaTcE?si=svIFkXF80TAqTM-X&t=1781

The tricks is to rebuild the layout based on inputs. It looks like that:

 layoutHandler = buildLayout(nodes);
        setTimeout(fitIntoView, 150);

I now have another issue, but let's open another ticket :)