swimlane / ngx-graph

Graph visualization library for angular
https://swimlane.github.io/ngx-graph
MIT License
922 stars 285 forks source link

When a new node or edge is added, the entire graph is redrawn #550

Open elainemartina opened 2 weeks ago

elainemartina commented 2 weeks ago

Describe the bug I am developing a solution using Angular v18 that allows users to create a graph, similar to what is possible in Miro, where they can add new nodes and create edges between source and target nodes. However, every time a new node or edge is added, the entire graph is redrawn. I want to prevent this from happening, ensuring that the graph (nodes and edges) remains in the positions where the user placed them. Does anyone know how to achieve this?

Expected behavior The application has a button to add new nodes. When a node is clicked, an option point appears to create an edge from the source node to the target node. Users are able to drag the nodes to position them as they desire. The graph should not be redrawn every time a new node or edge is added.

@Kr0san89 do you know what should I do?

Kr0san89 commented 2 weeks ago

Hello,

as a general information when you plan to build somthing like miro

So now for the technical part :)

added, the entire graph is redrawn. I want to prevent this from happening, ensuring that the graph (nodes and edges) remains in the positions where the user placed them.

for that i created already a description here: https://github.com/swimlane/ngx-graph/issues/322

For other features you might want to add yourself svg elemtens to the ngx-graph by using the content projection and just add normal "svg" Elements to it. https://swimlane.github.io/ngx-graph/custom-templates#custom-svg There you always have to position the svg's yourself, but there are a lot of information aboud svg's in the internet.

Hope this helps you :) Would be very happy to here from you, if you succeded and used this or another lib for it